java的图片闪烁动画的思路_css 如何实现一个闪烁的图片效果呢？

摘要：

下文讲述使用css脚本实现”一个闪烁图像动画”的方法分享，如下所示；

实现思路:

通过设置一个改变透明度的动画，

使图片的透明度发生变化,形成时隐时现的闪烁效果

例:

maomao365.com

css实现闪烁图片动画的示例分享

---

/* Firefox*/

@-moz-keyframes dongHua {

0% {

opacity:1;

}

50% {

opacity:0;

}

100% {

opacity:1;

}

}

@-webkit-keyframes dongHua {

0% {

opacity:1;

}

50% {

opacity:0;

}

100% {

opacity:1;

}

}

/* IE */

@-ms-keyframes dongHua {

0% {

opacity:1;

}

50% {

opacity:0;

}

100% {

opacity:1;

}

}

/* Opera and prob css3 final iteration */

@keyframes dongHua {

0% {

opacity:1;

}

50% {

opacity:0;

}

100% {

opacity:1;

}

}

.shanShuoTuPian {

-moz-animation: dongHua normal 2s infinite ease-in-out; /* Firefox */

-webkit-animation: dongHua normal 2s infinite ease-in-out; /* Webkit */

-ms-animation: dongHua normal 2s infinite ease-in-out; /* IE */

animation: dongHua normal 2s infinite ease-in-out; /* Opera and prob css3 final iteration */

}

src="http://www.maomao365.com/wp-content/uploads/2020/01/css_bg.png"

/>

css实现闪烁图片的示例分享