all_fixtures为10000px

Question

我想要实现的是在达到更大div中的第一个/最后一个div时“停止”动画。

我的设置：首先我计算视图从某个div开始，类“关闭”然后我用导航按钮左右动画#all_fixtures。一切正常！

我需要的是动画在到达 #all_fixtures 包装div中的第一个/最后一个 .fixture div时停止。

的jQuery

// Find first div with the class '.closed' and start view there
$(function() {
$('#all_fixtures').css({marginLeft: -$('.closed').last().offset().left});
});

// Animate div left/right           
$('.scores_prev').click(function() {
$('#all_fixtures').animate({ 'left': '+=400px' }, 300 );
});

$('.scores_next').click(function() {
$('#all_fixtures').animate({ 'left': '-=400px' }, 300 );
});

HTML

   <div id="all_fixtures">
       <div class="fixture closed"> 4 </div>
       <div class="fixture closed"> 3 </div>
       <div class="fixture closed"> 2 </div>
       <div class="fixture closed"> 1 </div> <!-- start view here -->
       <div class="fixture"> 1 </div>
       <div class="fixture"> 2 </div>
    </div>
    <a class="scores_prev"> PREV </a>
    <a class="scores_next"> NEXT </a>

备注：

all_fixtures为10000px
.fixture宽约200px＆amp;向右浮动（意味着#all_fixtures左边有空格）

我已尝试过这些方面的内容，但我无法让它发挥作用：https://stackoverflow.com/a/10410528/1864622

///

Answer 1

您可以像这样在 #all_fixtures 包装中获取第一个和最后一个div：

$("#all_fixtures div.fixture:first");
$("#all_fixtures div.fixture:last");

获得div后，您可以通过调用.stop()来停止动画。在元素上调用.stop（）时，会立即停止当前运行的动画（如果有）。例如，如果在调用.stop（）时使用.slideUp（）隐藏元素，则现在仍将显示该元素，但该元素将是其先前高度的一小部分。不调用回调函数。

jQuery在最后一个div停止动画

all_fixtures为10000px

1 个答案: