0

これはかなり一般的な問題ですが、テキストをフェードアウトし、変更してからフェードインしたいと考えています。

これまでの私のコードは次のとおりです。

setTimeout(function(){
    $("#ilovequote").fadeOut( 500, function(){
     var ilovequotes = ["CSS3", "Photoshop", "AJAX", "jQuery", "Social Media API's"];
    var rand = ilovequotes[Math.floor(Math.random() * ilovequotes.length)];
    $('#ilovequote').html(rand);
        $("#ilovequote").fadeIn( 500);
    });
  }, 500);
});

しかし、これは何らかの理由で機能しません。私はこれについて助けを求めています。基本的には、単語を読むのに十分な長さの滑らかなアニメーションが欲しいです。

JSフィドル

http://jsfiddle.net/rJDWb/

4

2 に答える 2

2

このようなものが欲しいですか？

var cnt = 0;
setInterval(function(){
cnt ==4 ? cnt=0:cnt++
    $("#ilovequote").fadeOut( 500, function(){
        var ilovequotes = ["CSS3", "Photoshop", "AJAX", "jQuery", "Social Media API's"];
        var rand = ilovequotes[cnt];
        $('#ilovequote').html(rand);
        $("#ilovequote").fadeIn( 500);
    });
},1000);

jsFiddle のデモはこちらhttp://jsfiddle.net/BMBDd/2/

于 2013-02-05T08:56:14.137 に答える
1

余分なものを取り除く});

setTimeout(function () {
    $("#ilovequote").fadeOut(500, function () {
        var ilovequotes = ["CSS3", "Photoshop", "AJAX", "jQuery", "Social Media API's"];
        var rand = ilovequotes[Math.floor(Math.random() * ilovequotes.length)];
        $('#ilovequote').html(rand);
        $("#ilovequote").fadeIn(500);
    });
}, 500);

[アップデート]：

更新されたjsfiddleの最後の2行を入れ替えます（7行目と8行目）

http://jsfiddle.net/samliew/rJDWb/2/

于 2013-02-05T08:49:35.443 に答える