Este artículo describe el método de JS para lograr el efecto indicativo de la barra de título de la página web. Compártelo para su referencia. El análisis específico es el siguiente:
A menudo vemos el efecto parpadeante de la barra de título de la página web en algunas herramientas de chat, como la sala de chat con tráfico actual. Resumamos un código rápido para implementar la barra de título de la página web parpadeante. Si está interesado, consultelo.
El proyecto de la compañía utiliza el efecto de este nuevo mensaje de mensaje, que se utiliza principalmente para solicitar a los usuarios a tener nuevos mensajes. El código de implementación específico es el siguiente:
var newMessageremind = {_ Step: 0, _title: document.title, _timer: null, // show nuevo mensaje de mensaje show: function () {var temps = newmessageremind._title.replace ("【】", "). {newMessageremind.show (); // Escriba la operación de cookie aquí newMessageremind._step ++; if (newMessageremind._step == 3) {newMessageremind._step = 1}; if (newMessageremind._step == 1) {document.title = "【【【【【】 【【【【【【【【【【【【【【【【【【【【【【【【【【【【【【【【【【【【【【【【【【【【【【【【【【【【【【【【【【【【【【【【【【【【【【【【【eléctrica. 2) {document.title = "【Nuevo mensaje】" + temps};}, 800); return [newMessageremind._timer, newMessageremind._title];}, // cancele el mensaje nuevo mensaje: function () {ClearTimeOut (NewMessessageremind._timer); document.title = newmesseremind._title; aquí}}; Llamando para mostrar un nuevo mensaje de mensaje: newMessageRemind.show();
Llame para cancelar el nuevo mensaje del mensaje: newMessageRemind.clear();
Después de leer el código anterior, lo optimizaré yo mismo. No importa qué, puedo absorber y aprenderlo yo mismo. :) Creo principalmente que el campo NewMessageremind en su código se usa demasiado, se ve denso e incómodo. Pensé en mostrarlo de una manera nueva, así que obtuve el siguiente código:
var newMessageremind = function () {var i = 0, title = document.title, loop; return {show: function () {loop = setInterval (function () {i ++; if (i == 1) document.title = '【nuevo mensaje】' + title; if (i == 2) document.title = '【】' + title; if (i == 3) i = 0;}, 800); }, detener: function () {clearInterval (bucle); document.title = title; }}; } ();¿Es mucho más fresco? ^_^
<! Doctype html> <html lang = "en-us"> <head> <meta charset = "utf-8"> <title> ¡Son vacaciones! ! ! </title> </head> <body> <button id = "test"> stop </boton> <script type = "text/javaScript"> var newMessageremind = function () {var i = 0, title = document.title, loop; return {show: function () {loop = setInterval (function () {i ++; if (i == 1) document.title = '【nuevo mensaje】' + title; if (i == 2) document.title = '【】' + title; if (i == 3) i = 0;}, 800); }, detener: function () {clearInterval (bucle); document.title = title; }};} (); newMessageremind.show (); document.getElementById ('test'). onClick = function () {newMessageremind.stop ();}; </script> </body> </html>Continuar compartiendo uno
<script> (function () {var orurIntItile = document.title, titlettime; document.addeventListener ('VisibilityChange', function () {if (document.hidden) {document.title = 'Where the Dead Fhost fue!'; ClearTimeout (Titletime);} más {document.title = (つェ⊂) Huh! Es bueno de nuevo; setTimeOut (function () {document.title = OrigIntitile;}, 2000);Espero que este artículo sea útil para la programación de JavaScript de todos.