Das Beispiel in diesem Artikel beschreibt, wie Sie mit js den blinkenden Aufforderungseffekt der Titelleiste einer Webseite erzielen. Teilen Sie es als Referenz mit allen. Die spezifische Analyse lautet wie folgt:
Wir sehen häufig den blinkenden Effekt der Webseiten-Titelleiste in einigen Chat-Tools, z. B. in den aktuellen Chatrooms mit hohem Datenverkehr. Nachfolgend fassen wir einen Code zum Realisieren der blinkenden Eingabeaufforderung der Webseiten-Titelleiste zusammen , Sie können sich darauf beziehen.
Dieser neue Nachrichtenaufforderungseffekt wird in den Projekten des Unternehmens verwendet und dient hauptsächlich dazu, Benutzer daran zu erinnern, dass es neue Nachrichten gibt. Der spezifische Implementierungscode lautet wie folgt:
var newMessageRemind={
_step: 0,
_title: document.title,
_timer: null,
//Eingabeaufforderung für neue Nachricht anzeigen
show:function(){
var temps = newMessageRemind._title.replace("【 】", "").replace("【Neue Nachricht】", "");
newMessageRemind._timer = setTimeout(function() {
newMessageRemind.show();
//Schreiben Sie hier den Cookie-Vorgang
newMessageRemind._step ;
if (newMessageRemind._step == 3) { newMessageRemind._step = 1 };
if (newMessageRemind._step == 1) { document.title = "【 】" temps };
if (newMessageRemind._step == 2) { document.title = "[Neue Nachricht]" temps };
}, 800);
return [newMessageRemind._timer, newMessageRemind._title];
},
//Eingabeaufforderung für neue Nachricht abbrechen
klar: function(){
clearTimeout(newMessageRemind._timer);
document.title = newMessageRemind._title;
//Schreiben Sie hier den Cookie-Vorgang
}
};
Rufen Sie auf, um die Erinnerung an neue Nachrichten anzuzeigen: newMessageRemind.show();
Rufen Sie an, um die Erinnerung an neue Nachrichten abzubrechen: newMessageRemind.clear();
Nachdem Sie den obigen Code gelesen haben, können Sie ihn selbst optimieren. Es ist gut, wenn Sie ihn aufnehmen und lernen können. :) Ich hatte vor allem das Gefühl, dass das Feld „newMessageRemind“ in seinem Code zu oft verwendet wurde und es zu dicht und unbequem aussah. Ich wollte es auf eine frische Art und Weise darstellen, also habe ich mir den folgenden Code ausgedacht:
var newMessageRemind = function () {
var i = 0,
title = document.title,
Schleife;
Geben Sie {
zurück
show: function () {
loop = setInterval(function () {
ich ;
If ( i == 1 ) document.title = '[Neue Nachrichten]' title;
If ( i == 2 ) document.title = '【 】' title;
Wenn (i == 3) i = 0;
}, 800);
},
Stopp: Funktion () {
,,,,,,,,,, ,,,,,,,,,,,,,,,
document.title = title;
}
};
} ();
Ist es nicht viel frischer? ^_^
Code kopieren