Heim >Web-Frontend >js-Tutorial >So verwenden Sie JQuery, um einen blinkenden Texteffekt zu erzielen
So verwenden Sie JQuery, um einen blinkenden Texteffekt zu erzielen
- coldplay.xixiOriginal
- 2020-12-07 10:40:362507Durchsuche
So verwenden Sie jquery, um den blinkenden Texteffekt zu erzielen: Rufen Sie zuerst die PID der neuesten Notiz ab und flashen Sie dann die Notiz, nachdem Sie sie erfolgreich hinzugefügt haben. Anschließend kann die blinkende Methode in die Funktion geschrieben und schließlich aufgerufen werden blinkt. Wenn Sie einen Timer benötigen, schalten Sie ihn einfach ein.
Die Betriebsumgebung dieses Tutorials: Windows7-System, JQuery3.2.1-Version, Dell G3-Computer.
Empfohlen: jquery-Video-Tutorial
So verwenden Sie jquery, um den blinkenden Texteffekt zu erzielen:
1. Zuerst müssen Sie die PID der neuesten Notiz abrufen. Diese PID kann der von der zurückgegebene Wert sein Schnittstelle im Hintergrund.
2. Die Notiz blinkt, nachdem das Hinzufügen erfolgreich war.
3 Die Flash-Methode kann in die Funktion geschrieben und aufgerufen werden.
4. Wenn es blinkt, muss ein Timer vorhanden sein. Wenn Sie den Timer einschalten, müssen Sie den Timer ausschalten.
Beispiel: Flash beim Öffnen der Seite.
Codebeispiel:
<!DOCTYPE HTML>
<html>
<head>
<title>闪动提示</title>
<style>
*{ margin:0; padding:0;}
.box{color: #000}
.red{color:#d00;}
</style>
<script type="text/javascript" src="jquery-1.11.1.min.js"></script>
<script>
function shake(element,className,times){
var i = 0,
t = false ,
o = element.attr("class"),
c = "",
timestimes = times||2;
if(t) return;
t = setInterval(function(){
i++;
c = i%2 ? o + ' ' + className : o;
element.attr("class",c);
if(i==2*times){
clearInterval(t);
element.removeClass(className);
}
},200);
};
$(function(){
//domready 就闪动
shake($(".box"),"red",3);
});
</script>
</head>
<body>
<div class="box">打开就闪动</div>
</body>
</html>Der folgende Code löst zwei Arten von Klick-Flashes und verschiedene Überprüfungs-Flashes aus, z. B. das Blinken von Formulareingabefehlern.
Codebeispiel:
//点击闪动
$("#box1").bind({
click:function(){
shake($(this),"red",3);
return false;
}
});
//通不过mail校验闪动
$("#mail").blur(
function(){
if(!/^\w+([-+.]\w+)*@\w+([-.]\w+)*\.\w+([-.]\w+)*/.test($(this).val())) {
shake($(this),"red",3);
}
}
);Verwandte Lernempfehlungen:Javascript-Video-Tutorial
Das obige ist der detaillierte Inhalt vonSo verwenden Sie JQuery, um einen blinkenden Texteffekt zu erzielen. Für weitere Informationen folgen Sie bitte anderen verwandten Artikeln auf der PHP chinesischen Website!