jQuery在div移出屏幕之前停止左动画

Posted 2023-05-08

【中文标题】jQuery在div移出屏幕之前停止左动画

【英文标题】：jQuery stop left animation before div moves off screen

【发布时间】：2013-09-14 00:39:35

【问题描述】：

我为表单创建了一个基本滑块，一旦表单的一个部分完成，用户单击“下一步”，下一部分滑入....如果用户想返回，他们单击上一个等。

我的问题是，如果用户通过单击“上一个”开始，那么表单会以错误的方式滑动并显示为空白，因此我需要在表单的第一部分和最后一部分禁用按钮。

我的滑块代码很简单：

$(document).ready(function()
//next/prev buttons

$("#calc_next").click(function()
    $("#calc_container").animate(
        left: '-=800'
    );
);
$("#calc_prev").click(function()
    $("#calc_container").animate(
        left: '+=800'
    );
);

您可以在这里查看我的工作示例http://www.samskirrow.com/projects/distr/index3.html

这里有一个 jsfiddle http://jsfiddle.net/5udRZ/

【参考方案1】：

像这样在$("#calc_prev").click(function() 中设置if 语句

$("#calc_prev").click(function()
    if($("#calc_container").position().left >= 0 ) 
        return;
    else  
        $("#calc_container").animate(
            left: '+=800'
        );
    
);

【讨论】：

@SamSkirrow 好吧，如果你不制作小提琴，我无法测试它......你能找出哪些部分 do 有效（在每一行使用console.log()）它的在这里的黑暗中努力工作。

@SamSkirrow kk 我知道它使用$("#calc_container").position().left 而不是$("#calc_container").attr("left") 将在几秒钟内编辑

上一个动画可能在您检查左侧位置时正在进行，您将得到错误的值进行比较