Jquery使用动画效果动画效果的Flash动画文本

我在此论坛上在合理的时间内没有找到任何答案。所以在这里我问。Jquery使用动画效果动画效果的Flash动画文本

我试图用轻松的'摆动'来从左到右的动画文本，但同时，使它淡入，然后在结束之前淡出。

我在三个步骤中找到了一个解决方案，但我觉得很难保持和修改。使用这种技术也不可能使用摆动缓动。

我做的是：

有生左+ = 10和不透明度从0到0.8中相同的动画 1秒。
动画左+20秒持续2秒。
动画左+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});

有没有人有更好的解决方案？

来源

2011-03-08 Guillaume Bois

你见过下面的插件吗？ http://farukat.es/journal/2011/02/514-new-creation-jquery-runloop-plugin

演示： http://files.farukat.es/creations/runloop/

来源

2011-03-08 19:39:53 calumbrodie

我一直在寻找一个jQuery原生解决方案，以避免在页面上其它附加荷载 –

缩小了插件1.7Kb！它有什么不同？ – calumbrodie

动画的逻辑可以被包裹在简单的功能

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

来源

2013-07-21 23:02:53 twil

Jquery使用动画效果动画效果的Flash动画文本

回答

相关问题