Heim > Artikel > Web-Frontend > Erfahren Sie mehr über die Verwendung der fadeOut()-Methode in jQuery

Erfahren Sie mehr über die Verwendung der fadeOut()-Methode in jQuery

巴扎黑Original: 2017-06-29 11:58:351208Durchsuche

In diesem Artikel wird hauptsächlich die Verwendung der fadeOut()-Methode in jQuery vorgestellt und die Funktion, Definition und spezifischen Verwendungstechniken der fadeOut()-Methode anhand von Beispielen analysiert siehe es

Das Beispiel in diesem Artikel beschreibt die Verwendung der fadeOut()-Methode in jQuery. Teilen Sie es als Referenz mit allen. Die spezifische Analyse lautet wie folgt:

Diese Methode erreicht den Ausblendeffekt aller passenden Elemente durch Änderungen der Deckkraft und löst optional eine Rückruffunktion nach der Animation ist abgeschlossen.

Verwendung der fadeOut()-Methode:

Diese Methode kann die Dauer des Animationseffekts angeben. Zum Beispiel:

Der Code lautet wie folgt:

$("p").fadeOut(5000)

Der obige Code legt fest, dass der Ausblendeffekt von p kann in 5000 Millisekunden erfolgen (5 innerhalb von Sekunden abgeschlossen).

Diese Methode kann auch eine Rückruffunktion auslösen, nachdem die Animation abgeschlossen ist. Zum Beispiel:

Der Code lautet wie folgt:

$("p").fadeOut(5000,function(){alert('Animationseffekt abgeschlossen!')})

Der obige Code kann die Rückruffunktion auslösen, nachdem die Animation abgeschlossen ist, sodass ein Eingabeaufforderungsfeld angezeigt wird.

Beispielcode:

Der Code lautet wie folgt:

<!DOCTYPE HTML>
<html>
<head>
<meta charset="utf-8"/>
<meta name="author" content="http://www.jb51.net/" />
<title>fadeOut()函数-脚本之家</title>
<style type="text/css">
p{
  
background
:#060;
  width:300px;
  height:300px;
  color:red
}
</style>
<script type="text/
javascript
" src="mytest/jQuery/jquery-1.8.3.js"></script>
<script type="text/javascript"> 
$(
document
).ready(function(){
  $("#up").click(function(){
    $("p").fadeOut(5000,function(){alert(&#39;动画效果完成！&#39;)});
  })
})
</script> 
</head>
<body>
  <p></p>
  <button id="up">点击查看效果</button>
</body>
</html>

Klicken Sie auf die Schaltfläche

, um p langsam auf einen transparenten Effekt zu setzen Es ist vollständig transparent. Geben Sie dann eine Rückruffunktion an.

Das obige ist der detaillierte Inhalt vonErfahren Sie mehr über die Verwendung der fadeOut()-Methode in jQuery. Für weitere Informationen folgen Sie bitte anderen verwandten Artikeln auf der PHP chinesischen Website!

Stellungnahme：

Der Inhalt dieses Artikels wird freiwillig von Internetnutzern beigesteuert und das Urheberrecht liegt beim ursprünglichen Autor. Diese Website übernimmt keine entsprechende rechtliche Verantwortung. Wenn Sie Inhalte finden, bei denen der Verdacht eines Plagiats oder einer Rechtsverletzung besteht, wenden Sie sich bitte an admin@php.cn

Vorheriger Artikel：Detaillierte Erläuterung der Verwendung der jQuery.fadeOut()-FunktionsinstanzNächster Artikel：Detaillierte Erläuterung der Verwendung der jQuery.fadeOut()-Funktionsinstanz

In Verbindung stehende Artikel

Mehr sehen