js实现图片的切换，特别急

左右两边2个按钮，中间三张图片，点击两个按钮，中间三张图片换成另外三张，我是js菜鸟，有难度的js看都看不懂。希望高手帮忙，代码做好少一点，因为要用到手机网站上。

解决方案 »

  1.   

    之前用jquery写的普通实现，楼主将图片放到li里面就行
    <style type="text/css">.mainDiv {
    width:100px;
    height:100px;
    position:relative;
    overflow:hidden;
    }ul{
    list-style-type: none;
    position:absolute;
    top:10px;
    z-index:2;
    width:500px;
    margin:0px;
    padding:0;
    } 
    li{
    height:100px;
    width:100px;
    background:red;
    float:left;
    }
    </style><body>
    <button id="prev">prev</button><button id="next">next</button><div id="mainDiv" class="mainDiv">
    <ul id="ulId">
       <li>111</li>
       <li>222</li>
       <li>333</li>
       <li>444</li>
       <li>555</li>
    </ul>
    </div></body>$(function(){
    var el = $("#ulId"),
        elLeft = el.offset().left,
        divLeft = $("#mainDiv").offset().left,
        liWidth = $("#ulId li:first-child").width();
    $("#prev").click(function(){
        var _left = el.offset().left + liWidth - divLeft;
        if (_left <= 0){
            el.animate({left: _left}, "slow");
        } else {
            alert("is top");
        }
    })
    $("#next").click(function(){
        var _left = el.offset().left - liWidth - divLeft;
        if (_left >= -400){
            el.animate({left: _left}, "slow");
        } else {
            alert("is last");
        }
    })
    })