Comment utiliser jquery pour obtenir un effet de texte clignotant-js tutoriel-php.cn

Comment utiliser jquery pour obtenir un effet de texte clignotant

coldplay.xixi

Libérer： 2021-01-07 18:18:37

original

2532 Les gens l'ont consulté

Comment utiliser jquery pour obtenir l'effet de texte clignotant : obtenez d'abord le pid de la dernière note, et flashez la note après l'avoir ajoutée avec succès ; S'il clignote, il doit y avoir une minuterie. Allumez simplement la minuterie.

Comment utiliser jquery pour obtenir un effet de texte clignotant

L'environnement d'exploitation de ce tutoriel : système Windows7, version jquery3.2.1, ordinateur Dell G3.

Recommandé : Tutoriel vidéo jquery

Comment utiliser jquery pour obtenir l'effet de texte clignotant :

1, commencez par obtenir it Le pid de la dernière note. Ce pid peut être la valeur renvoyée par l'interface qui vous est donnée par le background.

2. La note clignotera une fois l'ajout réussi

3. La méthode clignotante peut être écrite dans la fonction et appelée directement.

4. S'il y a un clignotement, il doit y avoir une minuterie. Si vous allumez la minuterie, vous devez l'éteindre.

Exemple, flash à l'ouverture de la page.

Exemple de code :

<!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 + &#39; &#39; + 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>

Copier après la connexion

Le code suivant provoque deux types de flashs de clic et différents flashs de vérification, tels que le flash d'erreurs de saisie de formulaire.

Exemple de code :

//点击闪动 
$("#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); 
    } 
} 
);

Copier après la connexion