如何使图标闪烁/闪烁，它出现在网页中 [英] How to make an icon flash/blink, which is present in a web page

问题描述

我几天前开始研究高级java（太迟了，我知道）。我陷入了制作图标（任务栏上出现）的特定任务闪烁。这种闪烁应该基于特定条件发生，这意味着它可以使用 javascript 来实现。

我一直在寻找一段时间，但是有没有办法让图标每隔1秒左右出现并消失以引入闪烁效果？

解决方案

HTML

 < img src ='image / source'alt ='闪烁！'id ='blinking_image'/> 
  

Javascript

  var img = document.getElementById（'blinking_image'）; 
 $ b $ var interval = window.setInterval（function（）{
 if（img.display =='hidden'）{
 img.style.visibility ='visible'; 
} else {
 img.style.visibility ='hidden'; 
} 
}，1000）; //这里的1000是毫秒，并确定间隔运行的频率。 
  

这会在 setInterval 中创建一个匿名函数，每1秒运行一次（1秒== 1000毫升）。要详细了解setInterval 在此处签出mdn。

每次运行时都会检查 img 是否为隐藏或可见，如果它隐藏，则显示它，如果它是可见的，则隐藏它。它通过检查 style.visiblity 属性来完成。您可以在此处了解有关 的更多信息。

I started working on advanced java few days before(too late to start on that, I know). I am stuck with a specific task of making an icon (which is present on the task bar) blink. This blinking should happen based on a specific condition, which means that it can be achieved using javascript.

I have been searching for a while now but is there a way to make an icon appear and disappear every 1 second or so to bring in the blinking effect ?

解决方案

HTML

<img src='image/source' alt='blinking!' id='blinking_image' />

Javascript

var img = document.getElementById('blinking_image');

var interval = window.setInterval(function(){
    if(img.display == 'hidden'){
        img.style.visibility = 'visible';
    }else{
        img.style.visibility = 'hidden';
    }
}, 1000); //the 1000 here is milliseconds and determines how often the interval should be run.

This creates an anonymous function inside the setInterval that runs every 1 second (1sec == 1000milisec). To see more about setInterval checkout the mdn here on it.

Each time it runs it checks to see if the img is hidden or visible if it's hidden then it shows it if it's visible then it hides it. It does this by checking the style.visiblity property. Which you can learn more about here on the mdn.

这篇关于如何使图标闪烁/闪烁，它出现在网页中的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！