1

リンクをクリックすると別のスライダーから移動するスライダーがあります。

これらのリンクは、jqueryアニメーション関数を使用して左側のcssパラメーターを変更します。動作しますが、数回クリックすると、数回クリックするとランダムにスタックします。

スライダーは、幅930pxのdivで始まり、マスクのように機能する非表示のオーバーフローです。

このdivの内部には、幅（200000px）とposition：relativeが大きい別のdiv（idスライド）があり、このdivは各スライドに対応しています（width：930pxのdiv;およびfloat：leftクラス名は "tratamento"）

メニューがあるすべての外に...メニューは、functiomanimateを使用してスライドdivのコンテンツをスクロールする左の位置を変更するjqueryクリック関数を呼び出します。

このスクリプトは機能します...しかし、数回クリックした後、クリックは数秒間ランダムに機能しません。理由がわからない、ここにコードがあります：

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を削除し、scriptタグのtype = "text / javascript"を使用して削除し、bind関数を試しました。それでも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 に答える