labviewvision图像闪烁

Posted 2023-04-23

参考技术A 程序面板右键要现实的控件—创建—属性节点—值 把显示控件换成显示控件的值

如何让图像闪烁？

【中文标题】如何让图像闪烁？

【英文标题】：How do you make an image blink?

【发布时间】：2012-08-20 08:42:48

【问题描述】：

我想知道如何在 CSS 中使图像闪烁，如果可能的话。我想让它在它所在的地方闪烁。

我也想改变速度，但主要是想让它闪烁。

【问题讨论】：

不要认为只使用 CSS 是可能的，但您可以使用 Javascript。

你能再解释一下“眨眼”吗？您是要让图像瞬间变亮，还是变白，还是换一种颜色？

<blink> 标签死于可怕的死亡是有原因的。

您可以为此使用 CSS 动画和关键帧，但这对于简单的眨眼来说可能有点矫枉过正。

【参考方案1】：

您可以使用 CSS 轻松完成。只需在图像的 CSS 元素中添加以下跨浏览器代码即可。如果您更改代码中的数字，您还可以设置时间。

-webkit-transition:all 1s ease-in-out;
-o-transition:all 1s ease-in-out;
-ms-transition:all 1s ease-in-out;
transition:all 1s ease-in-out;
-webkit-animation:blink normal 2s infinite ease-in-out; 
-ms-animation:blink normal 2s infinite ease-in-out; 
animation:blink normal 2s infinite ease-in-out;

【参考方案2】：

拯救 CSS 动画！

@keyframes blink 
    0% 
        opacity: 1;
    
    50% 
        opacity: 0;
    
    100% 
        opacity: 1;
    

img 
    animation: blink 1s;
    animation-iteration-count: infinite;

http://jsfiddle.net/r6dje/

您可以通过调整间隔使其急剧闪烁：

@keyframes blink 
    0% 
        opacity: 1;
    
    49% 
        opacity: 1;
    
    50% 
        opacity: 0;
    
    100% 
        opacity: 0;
    

http://jsfiddle.net/xtJF5/1/

【讨论】：

如果我悬停，图像不会闪烁。有什么选择吗？

这很好，但它也需要 Chrome 浏览器的代码。

您还需要为keyframes（如-moz-keyframes、-webkit-keyframes等）、animation-iteration-count（如-moz-animation-iteration-count、-webkit-animation-iteration-count等）和animation（-moz-animation、-webkit-animation 等）。

【参考方案3】：

使用 Javascript 的 setInterval 方法将其用作 W3Schools 的引用，然后将 css 从 visibility:visible 更改为 visiblity:hidden 我们不会使用 display:none，因为它也会删除图像的空间，但我们确实需要图像空间才能使闪烁的东西起作用。

【讨论】：

顺便说一句，请在 SO 上创建一个正式帐户。这真的很有帮助。谢谢。希望我的回答有帮助。