如何获得div的宽度，然后使用jquery设置动画

我对选择客户区幻灯片有问题，请查看下面的链接

现在这里有10个IMG，但它只是幻灯片和显示6个图像

我想缩略图滚动宽度滚动，直到所有图像完成

<div class="inner_right_main_tow thumbnailscroller">Content here</div>

---

之所以会出现这种情况，是因为您给了它一个固定的位置来滚动到

-710px

您需要使用

-=710px

使其动态。这意味着每次单击它都会向左移动710像素

$(".carousel-next").click(function(){
     $(this).parents(".thumbnailscroller").find("ul").animate({left: '-=710px'});
});

但现在你需要处理何时停止

---

更新以处理停止（变得更复杂）

我会更改CSS以使其更简单

CSS修复程序

• 从

  .carousel

  规则中删除

  9999px

• 对于

  .thumbnailscroller.carousel ul

  添加

  white-space:nowrap;
  display:inline-block;
  

• 对于

  .inner\u right\u main\u tow li

  移除

  浮动：left

  并添加

  display:inline-block;
  

jQuery

$(window).load(function(){
    var ul = $('.thumbnailscroller').find('ul'),
        step = ul.closest('.thumbnailscroller').width(),
        maxLoc = step - ul.width();

    $(".carousel-next").click(function(){
        var animated = ul.is(':animated'),
            currentLoc = parseInt(ul.css('left'),10),
            nextPos = Math.max(maxLoc, currentLoc -step); 

        if (!animated){
            ul.animate({left: nextPos});
        }
    });
    $(".carousel-previous").click(function(){
        var animated = ul.is(':animated'),
            currentLoc = parseInt(ul.css('left'),10),
            nextPos = Math.min(0, currentLoc +step); 

        if (!animated){
            ul.animate({left: nextPos});
        }
    });
});

---

你能告诉我如何停止吗？它可以正常工作…你太棒了，非常感谢亲爱的：）aka G。这只是在firefox中工作，而不是在其他浏览器中：（@shobi，将

.thumbnailscroller.carousel ul

设置为

左：0

。问题是，如果没有它，一些浏览器会返回

auto

，而不是一个值，并且解析代码会失败。@shobi，您在

ul

处添加了

宽度：9999px

。为什么？请删除它，并放回

空白：否包装；

到它。。

$(window).load(function(){
    var ul = $('.thumbnailscroller').find('ul'),
        step = ul.closest('.thumbnailscroller').width(),
        maxLoc = step - ul.width();

    $(".carousel-next").click(function(){
        var animated = ul.is(':animated'),
            currentLoc = parseInt(ul.css('left'),10),
            nextPos = Math.max(maxLoc, currentLoc -step); 

        if (!animated){
            ul.animate({left: nextPos});
        }
    });
    $(".carousel-previous").click(function(){
        var animated = ul.is(':animated'),
            currentLoc = parseInt(ul.css('left'),10),
            nextPos = Math.min(0, currentLoc +step); 

        if (!animated){
            ul.animate({left: nextPos});
        }
    });
});