如何使用JQuery使屏幕闪烁
[英]How to make screen flash with JQuery
问题描述
Is there any way to make the window, or at least the page, flash/blink with JQuery or plain JavaScript? 
有什么方法可以使用JQuery或纯JavaScript使窗口（或至少页面）闪烁/闪烁？ I'm trying to get the tab to flash too. 我也在尝试使选项卡闪烁。 Right now I have 现在我有
var flash = true;
var alert = setInterval(function(){
if (flash)
//doFlash
else
//stopFlash
flash = !flash;
}, 1000);
EDIT: Sorry for any confusion, I meant window brightness. 编辑：对不起，我的意思是窗口亮度。 I was wondering if there was a way to flicker the screen brightness to alert users. 我想知道是否有一种方法可以闪烁屏幕亮度来提醒用户。 I was also curious on how to flicker the tab when the window is minimized as well. 我也很好奇如何在最小化窗口时如何闪烁选项卡。
2 个解决方案
解决方案1
2 2015-07-24 16:44:59
You can choose a higher level element like body (or some main div ) and toggle the opacity of the element from 0 to 1 using the JS timer. 您可以选择诸如body （或一些main div ）之类的更高级别的元素，并使用JS计时器将元素的opacity从0切换为1 。
(you can change other things as per your needs) http://jsfiddle.net/josangel555/3w203Lsp/2/ （您可以根据需要更改其他内容） http://jsfiddle.net/josangel555/3w203Lsp/2/
JS (you can use the below lines, one for if and one for else.) JS（您可以使用以下几行，如果是，则使用另一行。）
$('.main').addClass("flash");
$('.main').removeClass("flash");
CSS (timer is enabling and disabling the opacity of the targeted element.) CSS（计时器正在启用和禁用目标元素的不透明度。）
.flash{
opacity: 0;
}
解决方案2
2 2015-07-24 16:46:12
Take a look at this! 看看这个！ Used jQuery and some CSS. 使用jQuery和一些CSS。
<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.0/jquery.min.js"></script> <!DOCTYPE html> <head> <link href='https://fonts.googleapis.com/css?family=Poller+One' rel='stylesheet' type='text/css'> <style> @keyframes blink { 50% { background: #cc5; background-size: 75px 150px; } } @-webkit-keyframes blink { 50% { background: #cc5; background-size: 75px 150px; } } @-moz-keyframes blink { 50% { background: #cc5; background-size: 75px 150px; } } .laser { animation: blink 2s infinite; -webkit-animation: blink 2s infinite; -moz-animation: blink 2s infinite; } </style> </head> <body> <button class="flash">click to blink</button> <script> // Button to toggle $(document).ready(function(){ $('.flash').click(function() { $('body').toggleClass('laser'); }); }); </script> </body>
声明:本站的技术帖子网页，遵循CC BY-SA 4.0协议，如果您需要转载，请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.