Heim > Artikel > Web-Frontend > So lassen Sie Elemente in JQuery nach oben gleiten und verschwinden
So lassen Sie Elemente in JQuery nach oben gleiten und verschwinden
- 青灯夜游Original
- 2022-04-27 19:28:122214Durchsuche
Methode: 1. Verwenden Sie slideUp(), die Syntax „$(“Element“).slideUp(milliseconds)“, um das ausgewählte Element gleitend auszublenden. 2. Verwenden Sie slideToggle(), die Syntax „$(“Element ") .slideToggle(milliseconds)", wenn sich das Element im angezeigten Zustand befindet, wird das Element gleitend ausgeblendet.
Die Betriebsumgebung dieses Tutorials: Windows7-System, jquery1.10.2-Version, Dell G3-Computer.
jquery-Methode, um zu erkennen, dass das Element nach oben gleitet und verschwindet.
1. Verwenden Sie die Methode slideUp()
slideUp(), um das ausgewählte Element gleitend auszublenden.
Hinweis: Ausgeblendete Elemente werden nicht vollständig angezeigt (beeinflussen nicht mehr das Layout der Seite).
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<script src="js/jquery-1.10.2.min.js"></script>
<script>
$(document).ready(function() {
$(".btn1").click(function() {
$("p").slideUp(1000);
});
});
</script>
</head>
<body>
<p>这是一个段落。</p>
<button class="btn1">上滑隐藏元素</button>
</body>
</html>
2. Mit slideToggle()
slideToggle() wird der Sichtbarkeitsstatus des ausgewählten Elements überprüft, wenn ein Element ausgeblendet ist. Das Element wird nach unten gleitend angezeigt.
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<script src="js/jquery-1.10.2.min.js"></script>
<script>
$(document).ready(function() {
$(".btn1").click(function() {
$("p").slideToggle(1000);
});
});
</script>
</head>
<body>
<p>这是一个段落。</p>
<button class="btn1">滑动的隐藏/显示元素</button>
</body>
</html>
【Empfohlenes Lernen: jQuery-Video-Tutorial, Web-Frontend-Video】
Das obige ist der detaillierte Inhalt vonSo lassen Sie Elemente in JQuery nach oben gleiten und verschwinden. Für weitere Informationen folgen Sie bitte anderen verwandten Artikeln auf der PHP chinesischen Website!