Este artículo describe cómo JS implementa el efecto de hacer que los títulos de las páginas web fluyen cuando llegan los mensajes. Compártelo para su referencia, como sigue:
<html xmlns = "http://www.w3.org/1999/xhtml"> <head runat = "servidor"> <title> una página de título </title> <script> var g_blinkid = 0; var g_blinkswitch = 0; var g_blinktitle = document.title; var g_onlineuser = "; null; var g_newmsg_sound = null; var g_app_num = 0; var g_appnum = 0; var g_bappmore = false; var g_inputtime = 0; function BlinkNewmsg () {document.title = g_blinkswitch % 2 == 0? "【【 -" + g_blinktitle: "【Nuevas noticias】 -" + g_blinktitle; g_blinkswitch ++;} g_blinkid = setInterval (BlinkNewMsg, 1000); function stopblinkNewMsg () {if (g_blinkid) {clearInterval (g_blinkid); g_blinkid = 0; document.title = g_blinktitle; }} </script> </head> <body> <form id = "form1" runat = "servidor"> <div> <input id = "button1" type = "button" value = "button" onClick = "stopblinkNewMsg ();"; " /> </div> </form> </body> </html>Consulte el jefe-26.JS de Kaixin.com
var g_blinkid = 0; var g_blinkswitch = 0; var g_blinktitle = document.title; var g_onlineuser = ""; var g_sysmsg_sound = null; var g_newmsg_sound = null; var g_app_num = 0; var g_appnum = 0; var g_bapp más = Var g_inputtime = 0; BlinkNewMsg () {var ahora = new Date (); var ahora = ahora.gettime (); if (nowtime - g_inputtime> 5000) {document.title = g_blinkswitch % 2? "【【 -" + g_blinktitle: "【Nuevas noticias】 -" + g_blinktitle; } g_blinkswitch ++;} function blinkonline () {document.title = g_blinkswitch % 2? "○" + g_onlineuser + "está en línea-" + g_blinktitle: "●" + g_onlineuser + "está en línea-" + g_blinktitle; g_blinkswitch ++; if (g_blinkswitch> 10) {stopblinkNewMsg (); }} función checknewmsg () {var url = "/home/newmsg.php"; var pars = ""; var myajax = new Ajax.Request (url, {método: "post", parámetros: pars, onComplete: function (req) {checknewmsgshow (req);}});} function stopblinkNewMsg () {if (g_blinkid) {clearval (g_blinkid); g_blinkid = 0; $ ("head_msgdiv"). style.display = "none"; document.title = g_blinktitle; }} var g_oldmsg = g_oldsysmsg = g_oldbbs = g_oldbbsreply = g_oldcomment = g_oldreply = 0; function checknewmsgshow (req) {var r = req.responseText; stopblinkNewmsg (); setTimeOut (checknewmsg, 60000); eval ("r ="+r); var a_msglist = new Array ("msg", "sysmsg", "bbsreply", "comentario", "respuesta"); if (r.notice == "1") {var prohibidsound = parseInt (R.Forbidsound); if (? eval ("g_old" + a_msglist [i] + "= c;"); }} var newmsg = parseInt (r.msg) + parseInt (r.bbs) + parseInt (r.bbsreply) + parseint (r.comment) + parseint (R.reply); var sysmsg = parseInt (r.sysmsg); var newChange = (parseInt (R.Msg) - G_oldmsg) || (ParseInt (R.BBS) - G_oldbbs) || (parseint (R.bbsreply) - g_oldbbsreply) || (parseint (r.comment) - g_oldcomment) || (parseint (r.reply) - g_oldreply); var syschange = (parseInt (r.sysmsg) - g_oldsysmsg); for (i = 0; i <a_msglist.length; i ++) {eval ("g_old" + a_msglist [i] + "= parseInt (r." + a_msglist [i] + ");"); } if (newmsg && newchange) { if (g_newmsg_sound == null) { g_newmsg_sound = new SWFObject("http://img.kaixin001.com.cn/i2/newmsg_sound.1.0.swf", "newmsg_sound_swf", "1", "1", "8", "#ffffff", verdadero); g_newmsg_sound.addParam ("lEtlEdcriptAccess", "siempre"); g_newmsg_sound.addparam ("wmode", "opaco"); g_newmsg_sound.addparam ("menú", "falso"); g_newmsg_sound.addvariable ("autoplay", "0"); } g_newmsg_sound.write ("head_msgsound_div"); } else if (sysmsg && syschange) { if (g_sysmsg_sound == null) { g_sysmsg_sound = new SWFObject("http://img.kaixin001.com.cn/i2/sysmsg_sound.1.0.swf", "sysmsg_sound_swf", "1", "1", "8", "#ffffff", verdadero); g_sysmsg_sound.addParam ("lEtlEdcriptAccess", "siempre"); g_sysmsg_sound.addparam ("wmode", "opaco"); g_sysmsg_sound.addparam ("menú", "falso"); g_sysmsg_sound.addvariable ("autoplay", "0"); } g_sysmsg_sound.write ("head_msgsound_div"); }} $ ("head_msgdiv"). style.display = "bloque"; g_blinkid = setInterval (BlinkNewMsg, 1000); } else if (0 && r.online.length) {g_blinkswitch = 0; g_onlineUser = R.Online; g_blinkid = setInterval (Blinkonline, 500); } for (i = 0; i <a_msglist.length; i ++) {if (! parseInt (r [a_msglist [i]])) {$ ("head_" + a_msglist [i] + "_num"). innerhtml = ""; if ($ ("body_" + a_msglist [i] + "_num")) {$ ("body_" + a_msglist [i] + "_num"). classname = "ql2"; $ ("Body_" + a_msglist [i] + "_num"). Innerhtml = "0 elementos nuevos"; }} else {$ ("head_" + a_msglist [i] + "_num"). innerhtml = "(" + r [a_msglist [i]] + ")"; if ($ ("body_" + a_msglist [i] + "_num")) {$ ("body_" + a_msglist [i] + "_num"). classname = "cr"; $ ("Body_" + a_msglist [i] + "_num"). Innerhtml = r [a_msglist [i]] + "nuevo"; } if (a_msglist [i] == "msg") {if ('function' == typeof (msg_view_checknewmsg)) {msg_view_checknewmsg (); }; }}}}} function outputhead () {var v_html = '<div id = "head">'+'<div>'+'<div style = "margin-top: 3px;">'+'<div style = "relleno-subfi src = "http://img.kaixin001.com.cn/i2/kaixinlogo.gif"/> </a> </div> '+' <div> '+' <div ID = "hn1"> '+' <div> <a href = "/home/? t = '+math.ceil (math.random ()+100) '"> Inicio </a> </iv>'+'<div> <a href =" javascript: xs (1); "> <img src =" http://img.kaixin001.com.cn/i/r_sj.gif "/> </a> </div>'+'<div> </iv>'+'<iv id =" hn1 " <div> <a href = "/home/"> mi página de inicio </a> </div> '+' <div> <a href = "/home/"> mi página de inicio </a> </div> '+' <div> mi página previa de la página de inicio: </div> '+' <div> '+' <a href = "/home/? _ previsual = amigo" objetivo = _blankkankkankkankkank onclick="javascript:hy();">'+' <div> style="margin:5px 3px;"><img src="http://img.kaixin001.com.cn/i/small-tri.gif" /></div>'+' <div style="cursor:pointer;">When friends visit</div>'+' <div></div>'+' </a> '+' </div> '+' <div> '+' <a href = "/home/? _ Preview = OTRO" Target = _blank onClick = "javascript: hy ();" > '+' <div style = "margin: 5px 3px;"> <img src = "http://img.kaixin001.com.cn/i/small-tri.gif"/> </div> '+' <div style = "cursor: pointer;"> cuando un stranger visite </div> '+' <div> </div> '+' </ae> '+'+' </div> '+' </div> '+' </div> '+' <div id = "hn_xx1"> <img src = "http://img.kaixin001.com.cn/i/r_xx13.gif"/> </div> '+' '+' <d "hn2"> '+' <div> <a href = " Math.Ceil (Math.random () * 100)+'"> Friends </a> </div>'+'<div> <a href =" javascript: xs (2); "> <img src =" http://img.kaixin001.com.cn/i/r_sj.gif "/> </a> </div>' <Div> '<Div>' <Div> '/'/Dive+ < frameBorDer = "0">/iframe> '+'-> '+' <div id = "hn2_l" style = "z-index: 2"> '+' <div> <a href = "/amigo/"> mis amigos </a> </div> '+' <div> <a href = "/amigo/? ViewType = en línea" href = "/amigo/group.php"> gestión de amigos </a> </div> '+' <div> <a href = "/home/fstatus.php"> Actualización de estado de amigos </a> </div> '+' <div> <a href = "/amigo/invita.php"> invitar a amigos a unirse </a> </div> '+' <div> <a href = "/amigo/search.php"> Encuentre amigos </a> </div> '+' </div> '+' <div> <a href = "/amigo/search.php"> Encuentre amigos </a> </div> '+' </div> '+' <div = "hn_xx2"> <imgg " src = "http://img.kaixin001.com.cn/i/r_xx13.gif"/> </div> '+' '+' <div id = "hn3"> '+' <div> <a href = "/group/? t = '+math.ceil (math.random () * 100)+'"> group </a> <Div> 'Div>' href = "JavaScript: xs (3);"> <img src = "http://img.kaixin001.com.cn/i/r_sj.gif"/> </a> </div> '+' <div> </div> '+' <div ity = "hn3_l"> '+' <div> <a href = " grupo </a> </div> '+' <div> <a href = "/group/flist.php"> amigos </a> </div> '+' <div> <a href = "/group/new.php"> Crear un nuevo grupo </a> </iv> '+' <div> <a href = "/grupo/búsqueda/fp"> todos los grupos </a> </div> <div id = "hn_xx3"> <img src = "http://img.kaixin001.com.cn/i/r_xx13.gif"/> </div> '+' '+' <div it = "hn_xx3"> <img src = "http://img.kaixin001.com.cn/i/i/r_" /> </div> '+' '+' <div id = "hn4" style = "padding-right: 28px;"> '+' <div> <a href = "/msg/? t = '+math.ceil (math.random () * 100)+'"> Message </a> </div> '+' <div> <a href = "javascript: xs (4);" src = "http://img.kaixin001.com.cn/i/r_sj.gif"/> </a> <span style = "Posición: Absolute; Top: 5px; izquierda: 65px; Display: Ninguno;" id = head_msgdiv> <a href = "/msg/" style = "margin-top: -5px;"> <img src = "http://img.kaixin001.com.cn/i/ddtx.gif" onmouseover = "javaScript: xs (4)" border = 0> </a> </span> </div> '+' <div> </div> '+' <div id = "hn4_l"> '+' <div> <a href = "/msg/inbox.php? t = '+math.ceil (math.random () * 100)+'"> Mensaje corto <span style = "Padding-left: 2px;" Red; ";"; " id = head_msg_num> </span> </a> </div> ' +' <div> <a href = "/msg/sys.php? t = ' + math.ceil (math.random () * 100) +'" "> Message del sistema <span style =" Padding-left: 2px; color: rojo; "id = head_sysmsg_num> </span> </span <div> <a href = "/comment/? t = ' + math.ceil (math.random () * 100) +'"> comment <span style = "padding-left: 2px; color: rojo;" 100) + '"> Responder de comentarios <span style =" Padding-left: 2px; color: rojo; "id = head_reply_num> </span> </a> </div>' + '<div> <a href ="/comment/uindex.php? T =' + math.ceil (math.random () * 100) + '" id = head_bbs_num> </span> </a> </div> ' +' <div> <a href = "/comment/ussend.php? t = ' + math.ceil (math.random () * 100) +'"> deje un mensaje responda <span style = "padding-left: 2px; color: rojo;" </div> '+' <div> <a href = "/amigo/invite.php"> invitar </a> ┊ <a href = "/friend/search.php"> Busque a alguien </a> ┊ <a href = "/set/cuenta.php"> cuenta </a> ┊ <a href = "/set/privacy.php"> privacio </a> ┊ ┊ href = "/login/logrout.php"> salir </a> </div> '+' <div> </div> '+' </div> '+' <div> </div> '+' <div> </div> '+' <div> </div> '+' <div> </div> '+' '<div> </div>'+'<div> </div> </div> </div> <Viv> '+' <div> </div> '+' <div> '+' <div> </div> '+' <div> '+' <div> </div> '+' <div> '+' id = "app_friend_tip" style = "Z-Index: 20000; posición: absoluto; fondo: #ffff; borde: 2px sólido sólido #F7f7f7; ancho: 160px; altura: 250px; display: none; "> '+' </div> '; document.writeLn (v_html);} function _outputapp (v_icon, v_link, v_title, v_aid, v_index_num) {if (-1 == v_link.indexof (") + = "? T =" + Math.Ceil (Math.random () * 100); '/' ==/'1/') {$ (/'app_friend_' + v_aid + '/').style.display=/'Block/';} "onMouseOut =" javaScript: $ (/'app_friend_' + v_aid +'').style.display=/'None/'';"> '' <Viv> <img src = ' +' + v_ + v_tyl '"align =" absMiddle "/> <a href ="' + v_link + '"> <b>' + v_title + '</b> </a> </div>' + '<div ID =" app_friend_' + v_aid + '"style =" visual + v_aid + ',/' ' + v_link +'/',/' ' + v_title +'/'); "> <img src =" http://img.kaixin001.com.cn/i2/xiasanjiao.gif "align =" Absmiddle "/> </div> +' <div> </div> ' +' </divit </divits </divInt; v_html;} function outpleAppApp (v_icon, v_link, v_title, v_aid, v_index_num) {document.writeLn (_outputapp (v_icon, v_link, v_title, v_aid, v_index_num));} function _setappLisThidEnhead () {if (if (if (if (if ( ''; _SetApplistTidDentail () {if (g_app_num ==-1) return ''; align = "ABSMIDDLE"> <a href = "javascript: showAppmore ();" documento style = "Padding: 7px 15px 0 0;"> <img src = "http://img.kaixin001.com.cn/i2/black_del.gif" style = "cursor: pointer;" componentes </p> </div> <div> <img src = "http://img.kaixin001.com.cn/i/index_app_add1.gif"/> <a href = "/app/list.php"> Agregar componente </a> </div> </div> <div style = "margen-top: -8px;" <img src = "http://img.kaixin001.com.cn/i/index_app_set1.gif"/> <a href = "/set/appman.php"> Configuración de componentes </a> </div> </div> ');} showAppmore () {if ($ ($ ("APPLISTME $ ("Applistmore"). style.display = "bloque"; style = "Text-Decoration: None;"> Close </a> '; href = "javascript: showappmore ();" style = "text-decoration:"> expandir </a> '; "Publicar", Pars: PARS, OnComplete: Funcion (Req) {outportAppInfoAlaxShow (req); v_html += _SetAppListhidDenhead (); $ ("head_appList"). innerhtml = v_html;} function outputTail () {document.writeLn ('<div> </div>'+'</div>'+'<div ID = "b">'+'<diM> <a href = "/s/s/oso.html" Target = "_ Blank"> Acerca de US </a> <Ad </aP> href = "/s/contact.html" target = "_ en blanco"> Información de contacto </a> <span> ┊ </span> <a href = "/t/fownles.html" target = "_ en blanco"> retroalimentación </a> <span> ┊ </span> <a href = "/s/holy.html" objetivo = "_ en blanco"> centro de ayuda </pla 2009 <a class = c6 href = http: //www.miibeian.gov.cn target = _blank> Beijing ICP Certificado No. 080482 </a> </div> '+' </div> ');}For more information about JavaScript related content, please check out the topics of this site: "Summary of ajax operation skills in JavaScript", "Summary of JavaScript switching effects and techniques", "Summary of JavaScript search algorithm skills", "Summary of JavaScript animation special effects and techniques", "Summary of JavaScript errors and debugging skills", "Summary of JavaScript data structures and Habilidades de algoritmo "," Resumen de los algoritmos y técnicas de traversal JavaScript "y" Resumen del uso de operaciones matemáticas de JavaScript "
Espero que este artículo sea útil para la programación de JavaScript de todos.