到达最后一个div时停止.animate() [英] Stop .animate() when it reaches last div

问题描述

所以我有一个Web应用程序，其中每个面板为480x300(状态栏为20px)和两个导航按钮向左或向右滚动.

So I have a web app where each panel is 480x300 (-20px for status bar) and two navigation buttons to scroll left or right.

现在一切正常，除非您继续滚动显示的最大面板数，否则它将继续进行.

Now everything works great, except when you continue scrolling past the max panels displayed, it keeps going.

我想知道是否可以在到达最后一个面板之后停止Jquery .animate().

I was wondering if it is possible to stop the Jquery .animate() after it reaches the last panel.

http://jsfiddle.net/gS33Y/

推荐答案

Hiya 另一个演示 http://jsfiddle.net/qpHSw/ 或 http://jsfiddle .net/yEsDQ/ 或 http://jsfiddle.net/yEsDQ /show

Hiya another demo http://jsfiddle.net/qpHSw/ or http://jsfiddle.net/yEsDQ/ or http://jsfiddle.net/yEsDQ/show

此示例动态地计算您的li并根据其调整动画.

this sample dynamically counts your li in ul and adjust the animate according.

代码

   var cur = 1;
var max = $(".scroll-content ul").children("li").length;

$("nav.back").click(function(){

    if (cur+1 > max) return;
    cur++;

    $("#panel").animate({
        marginLeft: "-=500px",
    }, 1000);

});

$("nav.forward").click(function(){
    if (cur-1 < 1) return;
    cur--; 
    $("#panel").animate({
        marginLeft: "+=500px",
    }, 1000);

});​

这篇关于到达最后一个div时停止.animate()的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！