一些点击后Jquery点击动画随机卡住

Posted 2023-05-08

【中文标题】一些点击后Jquery点击动画随机卡住

【英文标题】：Jquery click animate randomly stuck after some clicks

【发布时间】：2012-12-25 05:09:19

【问题描述】：

当您点击链接时，我有一个滑块会从另一个滑块移动。

这些链接使用 jquery animate 函数来更改左侧 css 参数。它可以工作，但是在点击了一些点击后，它在点击了一些后随机卡住了。

滑块以一个宽度为 930 像素的 div 开头，溢出隐藏，就像一个蒙版。

在这个 div 里面有另一个 div（id 幻灯片）有很多宽度（200000px）和位置：相对，这个 div 与每张幻灯片（宽度：930px 的 div；和 float:left 的类名是“tratamento”）相匹配

除了我们拥有的菜单之外...菜单调用​​ jquery click 函数，这些函数使用 functiom animate 来更改滚动幻灯片 div 中内容的左侧位置。

这个脚本可以工作...但是，在一些点击后，随机点击会在几秒钟内不起作用。不知道为什么，代码如下：

CSS：

 /* the mask div */
 #corpo2width:930px;
 margin:80px 25px 20px 25px; 
 overflow:hidden;

/* this div has every slide inside */
#slidewidth:200000px;
position:relative;

/* class that each slide uses */
.tratamento
 width:900px;
 padding-right:30px;
 float:left;

html

<div id="corpo2">
<div id="slide">

<div class="tratamento">
 test 1
</div>

<div class="tratamento">
 test 2
</div>

<div class="tratamento">
 test 3
</div>

</div></div>

调用点击函数的菜单：

    <ul>

    <li><a href="#" class="click1">Test 1</a></li>
    <li><a href="#" class="click2">Test 2</a></li>
    <li><a href="#" class="click3">Test 3</a></li>

    </ul>

最后是 jquery，我在完成所有操作后加载它：

    <script>

$(document).ready(function() 
    $( ".click1" ).click(function()$('#slide').animate(left: '0px', 500 ););
    $( ".click2" ).click(function()$('#slide').animate(left: '-930px', 500 );); 
    $( ".click3" ).click(function()$('#slide').animate(left: '-1860px', 500 ););    


);

    </script>

我尝试了一切，我删除了 (document).ready，使用并删除了脚本标签中的 type="text/javascript" 并尝试了绑定功能。它仍然会突然停止工作。

$( ".click1" ).bind("click", function()$('#slide').animate(left: '0px', 500 ););

【参考方案1】：

$(document).ready(function() 
    $( ".click1" ).click(function()$('#slide').stop().animate(left: '0px', 500 ););
    $( ".click2" ).click(function()$('#slide').stop().animate(left: '-930px', 500 );); 
    $( ".click3" ).click(function()$('#slide').stop().animate(left: '-1860px', 500 );); 
);