Heim >Web-Frontend >js-Tutorial >Analyse zur Verwendung der slideUp()-Methode in jQuery

Analyse zur Verwendung der slideUp()-Methode in jQuery

巴扎黑
巴扎黑Original
2017-06-29 11:30:111467Durchsuche

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

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

Diese Methode blendet alle übereinstimmenden Elemente dynamisch aus, indem sie die Höhe ändert (nach oben abnehmend), und nachdem das Ausblenden abgeschlossen ist, kann eine Rückruffunktion ausgelöst werden. Die
slideUp()-Methode passt nur die Höhe des Elements an, sodass das passende Element „gleitend“ ausgeblendet werden kann.

1. Syntaxstruktur:
Diese Methode kann die Dauer des Animationseffekts angeben. Wenn keine Zeit angegeben ist, verwenden Sie den Standardwert normal. Beispiel:

Der Code lautet wie folgt:

$("p").slideUp(5000)

Der obige Code kann den Animationseffekt festlegen 5000 Millisekunden (5 Sekunden) Abgeschlossen innerhalb.
Diese Methode kann auch eine Rückruffunktion auslösen, nachdem die Animation abgeschlossen ist. Zum Beispiel:

Der Code lautet wie folgt:

("p").slideUp(5000,function(){alert('Nach unten wischen abgeschlossen!')});

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

Der Code lautet wie folgt:

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

Klicken Sie im obigen Code auf die Schaltfläche, p wird langsam angezeigt und ein Dialog erscheint Das Feld wird nach Abschluss angezeigt.

Das obige ist der detaillierte Inhalt vonAnalyse zur Verwendung der slideUp()-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