Das Beispiel in diesem Artikel beschreibt, wie jQuery die Fadein-Methode verwendet, um den Fade-Out-Effekt zu erzielen. Teilen Sie es als Referenz mit allen. Die spezifische Analyse lautet wie folgt:
Der folgende JS-Code verwendet die Fadein-Methode von jQuery, um die Funktion der schrittweisen Anzeige des angegebenen Farbblocks zu steuern
1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 29 30 | <!DOCTYPE html>
<html>
<head>
<script src= "js/jquery.min.js" >
</script>
<script>
$(document).ready( function (){
$( "button" ).click( function (){
$( "#div1" ).fadeIn();
$( "#div2" ).fadeIn( "slow" );
$( "#div3" ).fadeIn(3000);
});
});
</script>
</head>
<body>
<p>Demonstrate fadeIn() with different parameters.</p>
<button>Click to fade in boxes</button>
<br><br>
<div id= "div1"
style= "width:80px;height:80px;display:none;background-color:red;" >
</div><br>
<div id= "div2"
style= "width:80px;height:80px;display:none;background-color:green;" >
</div><br>
<div id= "div3"
style= "width:80px;height:80px;display:none;background-color:blue;" >
</div>
</body>
</html>
|
Nach dem Login kopieren
Ich hoffe, dass dieser Artikel für alle bei der jQuery-Programmierung hilfreich sein wird.