Javascript背景颜色闪烁与淡入淡出

Question

我有一个需要持续闪烁背景颜色的div。

我想要它做的是从透明淡入红色并返回循环。我已经看到一些示例执行此操作，但它们都会影响div的全部内容，而不仅仅是background color。background。

其他示例有一个闪烁{{1}}，但它不是平滑过渡，这是我需要的。

如果可能的话，我宁愿不使用 CSS 动画。

感谢您的帮助！

Answer 1

您可以使用rgba颜色将颜色淡化为透明。

示例：

var ofs = 0;
var el = document.getElementById('imp');

window.setInterval(function(){
  el.style.background = 'rgba(255,0,0,'+Math.abs(Math.sin(ofs))+')';
  ofs += 0.01;
}, 10);

演示：http://jsfiddle.net/Guffa/BUL2z/

使用jQuery：

var ofs = 0;

window.setInterval(function(){
  $('#imp').css('background', 'rgba(255,0,0,'+Math.abs(Math.sin(ofs))+')');
  ofs += 0.01;
}, 10);