-4

3つ以上のステートメントを無期限にフェードアウトおよびフェードインしたいと思います。コードは次のとおりです。

    <div class= "background">
    <h6>
    <div id="one">This is the first statement</div>
    <div id="two">This is the second statement</div>
    <div id="third">You get the point</div>
    </h6> 
    </div>

私は質問を間違って言いました：私は#two交換し、交換し、交換したいなど#oneです。そして、ええ、私はあちこちを見ました。助けが必要なことをお詫びします。 #three#two#one#three

4

3 に答える 3

0 
setInterval(function(){
$('.background').fadeToggle('slow');
},1000);

アップデート

このようなもの？

var k = ["#one","#two","#third"]
var cnt = 0;
setInterval(function(){
    $(k[cnt]).fadeToggle('slow').siblings().hide();
    cnt++;
if(cnt ==3){cnt = 0;}    
},2000);

ここでのデモ：http：//jsbin.com/urikah/1/edit

于 2013-01-15T08:09:19.673 に答える
0

次のように、プロセス全体を最初からやり直す最後の関数で完了関数を使用fadeIn()して、次々に使用できます（jQueryのアニメーションキューは、最初のキューが完了するまで2番目のキューを待機させます）。fadeOut()

function fadeForever(sel) {
    $(sel).fadeOut().fadeIn(function() {
        fadeForever(sel);
    });
}

fadeForever("#one, #two, #three");

または、背景div全体をフェードさせたい場合は、次を使用できます。

fadeForever(".background");

もちろん、フェード時間を制御したい場合は、fadeOut()にタイミング引数を追加できます。fadeIn()

于 2013-01-15T08:09:23.870 に答える
0

デモ： http： //jsbin.com/ubiqob/5/edit/

編集：私はあなたの例によりよく一致するように私のjsbinを更新しました...

fade便宜上、私はあなたのdivにクラスを持っていました：

<div class= "background">
   <h6>
      <div class="fade">This is the first statement</div>
      <div class="fade">This is the second statement</div>
      <div class="fade">You get the point</div>
   </h6> 
</div>

次のCSSクラスを使用します。

.fade {
   position: absolute;
   display: none;
}

そして最後にjavascriptコード：

var j = 0,
    n = ('.fade').length;
    $('.fade:first').fadeIn(1000);

function change() {  
    $('.fade:visible').fadeOut(1000, function() {
    j = j + 1;
    $($('.fade')[j%n]).fadeIn(1000);
  });
}

setInterval(change, 2000);
于 2013-01-15T08:48:45.007 に答える