如何使用CSS 3转换创建循环渐变/渐变图像效果？ [英] How can I create a looping fade-in/out image effect using CSS 3 transitions?

问题描述

我想为图片创建循环淡入/淡出效果。

I’m trying to create a looping fade in/out effect for an image. It’s working in Chrome, but it doesn’t work in Firefox.

这里是代码： http://jsfiddle.net/FTLJA/254/

（我确实使它与jQuery一起工作，但这使得浏览器慢和flickery在Android手机，所以我尝试CSS代替。）

(I did make it work with jQuery but that made the browser slow and flickery on Android phones, so I’m trying CSS instead.)

感谢任何帮助。

更新：修复..请再次检查链接

Update: fixed.. please check the link again

推荐答案

好吧，如果ypu're只设置WebKit属性 @ - webkit-keyframes 且只有 -webkit-animation -... ），在WebKit而不是在Firefox - 添加他们与 -moz 前缀以及。同时删除'blink'周围的引号，使它只是... blink ，它工作 http://jsfiddle.net/FTLJA/261/

Well, if ypu're only setting the WebKit properties (only @-webkit-keyframes and only -webkit-animation-...), then of course it will work only in WebKit and not in Firefox - add them with -moz prefix as well. Also remove the quotes around 'blink' to leave it just... blink and it works http://jsfiddle.net/FTLJA/261/

这篇关于如何使用CSS 3转换创建循环渐变/渐变图像效果？的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！