之前有朋友问我博客里浏览器标签栏闪烁效果怎么做的

今天把代码贴出来吧

|---------------------------------------------------------------------------------------------------------------------|----------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------| | 1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 29 30 31 32 33 34 35 36 37 38 39 | hljs javascript // 使用message对象封装消息 var message = { time: 0, title: document.title, timer: null, // 显示新消息提示 show: function () { var title = message.title.replace("【　　　】", "").replace("【新消息】", ""); // 定时器，设置消息切换频率闪烁效果就此产生 message.timer = setTimeout(function () { message.time++; message.show(); if (message.time % 2 == 0) { document.title = "【新消息】" + title } else { document.title = "【　　　】" + title }; }, 600); return [message.timer, message.title]; }, // 取消新消息提示 clear: function () { clearTimeout(message.timer); document.title = message.title; } }; var hiddenProperty = 'hidden' in document ? 'hidden' : 'webkitHidden' in document ? 'webkitHidden' : 'mozHidden' in document ? 'mozHidden' : null; var title = document.querySelector('title'); var visibilityChangeEvent = hiddenProperty.replace(/hidden/i, 'visibilitychange'); var onVisibilityChange = function () { if (!document[hiddenProperty]) { message.clear() } else { message.show() } } document.addEventListener(visibilityChangeEvent, onVisibilityChange); |