1

当您单击链接时,我有一个滑块从另一个滑块移动。

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

滑块以一个宽度为 930 像素的 div 开头,并且溢出隐藏,就像一个遮罩一样。

在这个 div 里面有另一个 div(id 幻灯片)有很多宽度(200000px)和位置:相对,这个 div comports 每个幻灯片(divs with width:930px; and float:left 类名是“tratamento”)

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

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

CSS:

 /* the mask div */
 #corpo2{width:930px;
 margin:80px 25px 20px 25px; 
 overflow:hidden;}

/* this div has every slide inside */
#slide{width: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" 并尝试了绑定功能。它仍然 ramdonly 停止工作。

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

1 回答 1

0
$(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 );}); 
);
于 2013-01-10T18:01:41.730 回答