0
<html>
<head>
<script src="jquery.js"></script>
<script>
$(document).ready(function(){
    setInterval(function(){
    var i = 1;
        while(i<3){

             var left = $("#"+i).offset().left;
            $("#"+i).css({'left':left}).animate({'left':'-10000px'},8000);
            if(i == 1){
                i++;
            }
            if(i == 2){
                i--;
            }
        }


    },2500);

});
</script>
</head>

<body>
<div id=myDivWrapper style="overflow:hidden">
<div id=1 style="right:0;width:100%;height:100%;background:url('1.jpg');position:absolute;"></div>
<div id=2 style="right:0;width:100%;height:100%;background:url('2.jpg');">
</div>
<body>
</html>

while ループを使用して JQuery 画像スライダーを作成しようとしています。ここで、i はインクリメントする整数です。i を 3 にしたくないので、ループが停止します。そのため、i が 1 の場合はインクリメントし、i が 2 の場合はデクリメントする決定ステートメントを使用しました。しかし、これによりブラウザでラグが発生し、機能しません。このスクリプトがおかしいことはわかっています。でも、どこを間違えたかわかりますか?

4

2 に答える 2

2

あなたの問題はここにあります..

if(i == 1){
   i++;
}
if(i == 2){
    i--;
}

i が 1 の場合、最初のステートメントが true になり、次に 2 番目の if が実行されるので、その時点で i が 2 であるため、i の値が再び減少します。したがって、これがブラウザでラグを引き起こす問題です。これを解決するには、else または else if を使用します。

ここにあります。

if(i == 1) {
    i++;
}
else {
    i--;
}

OR

if(i == 1) {
   i++;
}
else if(i==2) {
  i--;
}

どちらも同じで、あなたのために働くでしょう。

于 2013-08-10T07:35:18.207 に答える