怎么让切换到了最后就停止啊?

现在是点击右边按钮无限制的切换了.
我想让它切换到了最后就停止切换了.要怎么来判断啊?关键是这里if(cur == li-1){
    return false;
}自己插入jquery文件.<!doctype html>
<html>
<head>
<style type="text/css">
*{padding:0;margin:0;}
.fl{float:left;display:inline;}
.fr{float:right;display:inline;}
.gallery_pic_small{width:757px;height:50px;position:relative;overflow:hidden;margin-top:8px;margin-left:9px}
.gallery_pic_small_w{width:836px;height:62px; background:url(../images/gallery_nav_bg.jpg) no-repeat;margin:0 auto 46px}
.gallery_small_left{margin-top:22px;margin-left:15px;width:16px;height:16px;overflow:hidden;background:orange;}
.gallery_small_right{background:orange;margin-top:22px;margin-left:10px;width:16px;height:16px;overflow:hidden} .gallery_pic_small_in{position:absolute;top:0;left:0;}
.gallery_pic_small_in li{float:left;width:;margin-right:13px;width:115px;display:inline}
.gallery_pic_small_in li img{border:1px solid #ccc}
</style>
<script type="text/javascript" src="jquery-1.6.min.js">
</script>
</head> <body>
<div class="gallery_pic_small_w" id="gallery_pic_small_w">
             <div class="gallery_small_left fl" id="gallery_small_left">
                 <img src="images/003_16.jpg" width="16" height="16">
                </div>
                
                <div class="gallery_pic_small fl">
                 <div class="gallery_pic_small_in" id="gallery_pic_small_in">
                     <ul>
                         <li><img src="images/003_03.jpg" width="113" height="44"></li>
                            <li><img src="images/003_05.jpg" width="113" height="44"></li>
                            <li><img src="images/003_07.jpg" width="113" height="44"></li>
                            <li><img src="images/003_09.jpg" width="113" height="44"></li>
                            <li><img src="images/003_11.jpg" width="113" height="44"></li>
                            <li><img src="images/003_13.jpg" width="113" height="44"></li>
                            <li><img src="images/003_17.jpg" width="113" height="44"></li>
                        </ul>
                    </div>
                </div>
                
                <div class="gallery_small_right fl" id="gallery_small_right">
                 <img src="images/003_19.jpg" width="16" height="16">
                </div>
            </div>
<script type="text/javascript">
    function gallery_change(o,e,l,r,m){
var li = $(o).find("li").length;
var li_w = m?$(o).find("li").width()+17:$(o).find("li").width();
$(o).find(e).css("width",li*li_w+"px")
var cur =0;
function move(n){
switch(n){
case 0:
if(cur == 0){
return false;
}
cur--;
if(m == true)
{
$(o).find(e).stop(true,true).animate({left:-(768*cur)},400)
}
else{
$(o).find(e).stop(true,true).animate({left:-(1000*cur)},400)
}
break;
case 1:
if(cur == li-1){
return false;
}
cur++;
if(m == true){
$(o).find(e).stop(true,true).animate({left:-(768*cur)},400)
}
else{
$(o).find(e).stop(true,true).animate({left:-(1000*cur)},400)
}
break;
}
}
$(o).find(l).click(function(){
move(0)
})
$(o).find(r).click(function(){
move(1)
})
}

gallery_change("#gallery_pic_small_w","#gallery_pic_small_in","#gallery_small_left","#gallery_small_right",true)
</script>
</body>
</html>

解决方案 »

  1.   

    你把-(768*cur)和-(1000*cur)全改成(li_w*cur)试试看.
      

  2.   

                                        if(cur == li-1){
                                            return false;
                                        }
                                        cur++;
    这个好像没什么问题。
    应该是你的CSS和        $(o).find(e).stop(true,true).animate({left:-(768*cur)},400) 可能有问题。你这种变换和所基于的CSS定义冲突，不能实现。
    如果是想做滚动的相片列表，可以参照很多现成的JQ相册插件。
      

  3.   

    正因为原本不难的事情你却做不好，所以建议你直接用现成的JS插件了，就是一组写好的CSS和JS文件。
    很多人只知道搜索复制粘贴，固然不好，但闭门造车也不好。