<div class="otherGoods">

    <!--3.1 看了又看-->

        <p class="look">-----看了又看-----</p>

        

        <!--3.2 相关商品-->

        <ul class="otherList">

        

        <li class="oli">

            <a href="#">

                <img src="upload/o1.jpg"/>

                </a>

                <span>￥358.00</span>

                <p>Hisens/海信 1635T 电信4G双核 4线程</p>

            </li>

            

        <li class="oli">

            <a href="#">

                <img src="upload/o2.jpg"/>

                </a>

                <span>￥318.00</span>

                <p>Hisens/海信 1635T 电信4G双核</p>

            </li>

            

        <li class="oli">

            <a href="#">

                <img src="upload/o3.jpg"/>

                </a>

                <span>￥338.00</span>

                <p>Hisens/海信 1635T 电信4G双核</p>

            </li>

             

        <li class="oli">

            <a href="#">

                <img src="upload/o4.jpg"/>

                </a>

                <span>￥458.00</span>

                <p>Hisens/海信 1635T 电信4G双核</p>

            </li>   

            

        <li class="oli">

            <a href="#">

                <img src="upload/o5.jpg"/>

                </a>

                <span>￥558.00</span>

                <p>Hisens/海信 1635T 电信4G双核</p>

            </li>

            

        <li class="oli">

            <a href="#">

                <img src="upload/o6.jpg"/>

                </a>

                <span>￥658.00</span>

                <p>Hisens/海信 1635T 电信4G双核</p>

            </li>

            

        <li class="oli">

            <a href="#">

                <img src="upload/o7.jpg"/>

                </a>

                <span>￥758.00</span>

                <p>Hisens/海信 1635T 电信4G双核</p>

            </li>

        </ul>       

        <!--3.3 上下滚动按钮-->

        <p class="rollButton">

        <img id="up" src="upload/up1.JPG">

            <img id="down" class="" src="upload/down1.JPG">

        </p>

    </div>

function displayOther()

{

var up = document.getElementById('up');

var down = document.getElementById('down');

var oli  = document.getElementsByClassName('oli');

var size = 3;

var n    = oli.length;

var count=0;

//

up.onclick = function()

{

if(count+size<n)

{

count++;

for(var j=0;j<n;j++)

{

oli[j].style.display = 'none';

}

for(var i=count;i<count+size;i++)

{

oli[i].style.display = 'block';

}

}//end if

};//end up.onclick 

//

down.onclick = function()

{

if(count>0)

{

count--;

for(var j=0;j<n;j++)

{

oli[j].style.display = 'none';

}

for(var i=count;i<count+size;i++)

{

oli[i].style.display = 'block';

}

}//end if

};//end down.onclick

};