闪烁一个字形图标

【问题标题】：Blink a glyphicon闪烁一个字形图标
【发布时间】：2016-06-24 19:08:20
【问题描述】：

我在 kendogrid 中使用 glyphicon。我希望字形图标在固定的时间间隔后闪烁。我的字形图标是

<span class="glyphicon glyphicon-one-fine-white-dot blink" title="{{ConsoleLabels.TTP_SENDING}}"></span>

【问题讨论】：

【解决方案1】：

在你的页面中添加这个 css

.blink {
  animation: blinker 1s linear infinite;
}

@keyframes blinker {  
  50% { opacity: 0.0; }
}

注意：对于旧版本，请使用前缀

【讨论】：

【解决方案2】：

由于您想使用 javascript 或 jquery 来实现，这里有一个简单的闪烁文本的方法（通过opacity）。该元素仍将保持其作为块的比例，但会被隐藏起来。

var value = false;
setInterval(function(){  
  value = !value;
  $('[data-blink]').css('opacity', Number(value))
}, 500)

<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.9.1/jquery.min.js"></script>

<<span data-blink>Blinking Text</span>>

【讨论】：