我在一家公司工作,并在html5中转换Flash广告横幅。

我需要转换从左侧滑入的Flash图像,同时执行像风一样的运动模糊效果。

我已将幻灯片转换为图像,但不确定如何添加多风效果。

这是我要复制的car image,这是我的代码jsfiddle
提前致谢。

的HTML

<div id = "wrapper" >
 <div id="mainContainer">
    <div id="text">
        <img id="Image_Car" src="http://i.share.pho.to/c43dc6d7_o.png" />
    </div>
 </div>
</div>


的CSS

#wrapper {
    left: 50px;
    top: 50px;
    width: 300px;
    height:250px;
    position: absolute;
}
#mainContainer {
    background: url('https://secure-ds.serving-sys.com/BurstingRes/Site-8188/Type-0/5fefb401-b187-4d82-b4db-cbd2ef29cc48.gif');
    width:300px;
    height:250px;
    overflow: hidden;
    position: absolute;
}
#Image_Car {
    position:absolute;
    overflow: hidden;
    margin:60px 8px;
    left: -120px;
}


jQuery的

 $(document).ready(function () {
     bannerAnimation();
 });

 function bannerAnimation() {
     //Jquery Animation
     $("#Image_Car").animate({
         left: "30"
     }, 500, function () {
         $("#Image_Car").animate({
             left: "10"
         }, 200);
     });
 }

最佳答案

这对您来说是一个非常好的插件:
DEMO

plugin

09-12 01:20