Question

.name{
  width: 10px;
  height: 10px;
  -webkit-transition:opacity 2s; /* For Safari 3.1 to 6.0 */
  transition:opacity 2s;

}

.students img:hover{
  width: 10px;
  height: 10px;
  opacity: 0.5;
}

现在我能够改变悬停时的不透明度，但我希望图像闪烁，即不透明度应该变为0然后返回到1然后再次变为0并返回到1，就像闪烁一样。希望我能解释我的问题

任何帮助将不胜感激。

提前致谢。

Answer 1

我建议使用jQuery或简单的javascript来达到这个目的。例如：

$(function () 
{
    flicker();
    function flicker () 
    {           
        $('#test').fadeIn(100, function ()
        {
            $('#test').fadeOut(150, function () 
            {                    
               setTimeout(flicker, 50);               
            });
        });
    }

});

live demo

您可以通过修改fadeIn，fadeOut函数和setTimeout的第二个参数来设置闪烁的速度。请注意它们是以毫秒为单位。

修改

我已经找到了仅使用CSS3的方法。这是live demo

如何使用css制作img闪烁（应该适用于所有浏览器）

1 个答案: