Jqueryアニメーションのような滑らかなフラッシュアニメーションテキスト

Question

私はこのフォーラムで妥当な時間内にこれに対する答えを見つけられませんでした。だからここで私は尋ねる。

私はその後、終了前にフェードアウトし、簡単に「スイング」で左から右にテキストをアニメーション化しようとしているが、同時に、それがフェードインしますよ。

私は3つの段階で解決策を見つけたが、私は維持し、修正することが非常に困難見つけます。この技術では、スイングイージングを使用することも不可能です。

私は何をすることです：1秒間に同じアニメーション に0.8に0から+ = 10と不透明度 を左

1. アニメーション。
2. animate left + = 20 for 2 sec。
3. アニメーション左+10および不透明度 0.8から0まで1秒。コードで

：

$("#teaserText").show().animate({opacity:0.8, left:'+=20'}, 1000, 'linear') 
$("#teaserText").animate({left:'+=40'}, 2000, 'linear') 
$("#teaserText").animate({opacity:0, left:'+=20'}, 1000, 'linear'); 

私は何か他のものを試してみましたが、それは私が望んでませんでした。フェードアウトする前に右のストップに移動します。私はそれが誰もがよりよい解決策を持っています。：

$("#teaserText").show().animate({opacity:0.8},{queue: false, duration: 1000}) 
$("#teaserText").animate({left:parseInt($("#teaserText").css("left"))+50}, {duration: 3000}, 'swing') 
$("#teaserText").animate({opacity:0},{duration: 1000}); 

をフェードアウトされながら移動しておきたいですか？次のプラグインを

Answer 1

を見たことがありますか？ http://farukat.es/journal/2011/02/514-new-creation-jquery-runloop-plugin

デモ：あなたのアニメーションの http://files.farukat.es/creations/runloop/

Answer 2

ロジックは単純な関数で

function swing_w_fading(selector, animation_options, duration, fade_duration) 
{ 
    if(typeof duration == "undefined") 
     duration = 3000; 

    if(typeof fade_duration == "undefined") 
     fade_duration = 600; 

    $(selector).show().animate({opacity:0.8}, { 
     queue: false, 
     duration: fade_duration 
    }); 
    $(selector).animate(animation_options, duration, 'swing') 
    setTimeout(function() { 
     $(selector).animate({opacity:0}, { 
      queue: false, 
      duration: fade_duration 
     }); 
    }, duration - fade_duration); 
} 

Demo here