我该怎么做："As the the record button is pressed, the button will be flashing"

Question

我正在Android系统上使用PhoneGap开发录音机功能。我正在Transformer Prime上进行测试。我在PhoneGap的JavaScript之上使用jQuery和jQuery UI。

我的问题是：当用户按下"录制"按钮时，如何使该按钮闪烁以指示应用程序正在录制？

当然，我想创建的效果是让用户知道它仍在录制。也许我可以设置一个计时器来提供当前的录制持续时间，或者类似的东西。

不幸的是，我不知道这些影响之一。谁能给我一个源代码的建议，以便我可以把它作为参考？

Answer 1

你可以

使用CSS：http://jsfiddle.net/fszhJ/。有一个关键帧，该关键帧将元素设置为前半部分不可见，另一半时间可见。（您可能希望添加其他前缀，而不仅仅是-webkit-。

@-webkit-keyframes keyframe {
    from {
        visibility: hidden;
    }
    50% {
        visibility: hidden;
    }
    to {
        visibility: visible;
    }
}
div {
    width: 200px;
    height: 200px;
    background-color: black;
    -webkit-animation: keyframe 1s infinite;
}​

Answer 2

如果使用 jQuery，则可以在记录按钮上方放置一个发光 png（最初不透明度为 0），在间隔动画中，您可以执行以下操作：

 isVisible = false;
 var interval = setInterval(function(){
     opacityValue = isVisible ? 0 : 1;
     glow.css( 'opacity',  opacityValue );
     isVisible = !isVisible;
 }, 500);

然后，当你想停止它时：

 clearInterval( interval );

如果你想让你的发光平滑地显示，你可以使用CSS过渡。