3

複数の引用符の回転子を機能させるのに苦労しています。

私は JS をいじってJsfiddle - Multiple Quote Rotatorを実行しています

jQuery(function(){
var quotes1 = [
[ '75', 'Happy Clients' ],
[ '25', 'Emails Typed a day' ],
];

var quotes2 = [
[ '14', 'Coffes a day' ],
[ '1', 'Squeacky Chair' ],
];
var quotes3 = [
[ '70', 'Phone Calls / Day' ],
[ '5', 'Spiders' ],
];
var quotes4 = [
[ '1000', 'Types on the keyboard' ],
[ '100%', 'Qualified Personel' ],
];
var quotes5 = [
[ '55', 'Planes' ],
[ '500', 'Girls' ],
];
var quotes6 = [
[ '160', 'Seo Campaigns running' ],
[ '1', 'Squeacky Chair' ],
];

$('.circle.one').loadText( quotes1, 200); 
$('.circle.two').loadText( quotes2, 400 ); 
$('.circle.three').loadText( quotes3, 600 ); 
$('.circle.four').loadText( quotes4, 800 ); 
$('.circle.five').loadText( quotes5, 1000 ); 
$('.circle.six').loadText( quotes6, 1200 );
});

$.fn.loadText = function( quotes, interval ) {
return this.each( function() {
    var obj = $(this);
    var quote = random_array( quotes );
    var delaytest = delaytest;
    var quote_text = '<p class="facts_h1">' + quote[[0],[0]] + '</p>' + '<p   class="facts_p">' + quote[[0],[1]] + '</p>';

    obj.parent().fadeOut( 'linear', function() { 
            obj.empty().html(quote_text );  
            obj.parent().fadeIn(500);
    });

    $("#quote-reload").click( function(){ 
            if( !obj.is(':animated') ) { 
                obj.loadText( quotes, interval );
           } 
    });
});
 }
 function random_array( aArray ) {
    var rand = Math.floor( Math.random() * aArray.length + aArray.length );
    var randArray = aArray[ rand - aArray.length ];
    return randArray;
 }

私の問題は、6 つの引用をアニメーションで次々に表示したいということです。

私が管理できるのは、グローバル フェード イン フェード アウトだけです...

私は理にかなっていますか？

4

2 に答える 2

1

私が管理できるのは、グローバル フェード イン フェード アウトだけです...

これは、すべての要素のコンテナーにfadeInandfadeOutを適用しているためです。フェード アニメーションをオブジェクト自体に適用します。詳細については、次のフィドルを参照してください。parent().circle

http://jsfiddle.net/6DFfr/

さらに：

  1. delay()アニメーションをずらすために使用します。
  2. fadeTo()代わりに使用fadeIn/fadeOut-fadeTo()不透明度のみをアニメーション化しfadeIn/fadeOutますが、要素も非表示にするため、要素の位置がジッターになります。
于 2012-11-28T02:57:40.867 に答える
0

それらのそれぞれに関数を適用するのではなく、要素のリストで機能する関数を 1 つ用意します。

その方法のデモンストレーションについては、この質問を確認してください。

于 2012-11-28T01:33:38.353 に答える