animation d'arrêt jQuery
Méthode jQuery stop()
La méthode jQuery stop() est utilisée pour arrêter les animations ou les effets avant qu'ils ne soient terminés.
La méthode stop() fonctionne avec toutes les fonctions d'effets jQuery, y compris les diapositives, les fondus et les animations personnalisées.
Syntaxe?:
$(selector).stop(stopAll,goToEnd);
Le paramètre facultatif stopAll spécifie si la file d'attente d'animation doit être effacée. La valeur par défaut est false, ce qui arrête uniquement les animations actives, permettant ainsi à toutes les animations en file d'attente de s'exécuter à l'envers.
Le paramètre facultatif goToEnd spécifie s'il faut terminer l'animation en cours immédiatement. La valeur par défaut est faux.
Ainsi, par défaut, stop() effacera l'animation actuelle spécifiée sur l'élément sélectionné.
L'exemple suivant montre la méthode stop() sans paramètres?:
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<script src="http://libs.baidu.com/jquery/1.10.2/jquery.min.js">
</script>
<script>
$(document).ready(function(){
$("#div1").click(function(){
$("#div2").slideDown(5000);
});
$("#stop").click(function(){
$("#div2").stop();
});
});
</script>
<style type="text/css">
#div2,#div1
{
padding:5px;
text-align:center;
background-color:#e5eecc;
border:solid 1px #c3c3c3;
}
#div2
{
padding:50px;
display:none;
}
</style>
</head>
<body>
<button id="stop">停止滑動(dòng)</button>
<div id="div1">點(diǎn)我向下滑動(dòng)面板</div>
<div id="div2">我們必須接受失望，因?yàn)樗怯邢薜模f(wàn)不可失去希望，因?yàn)樗菬o(wú)窮的</div>
</body>
</html>Exécutez le programme pour l'essayer
jQuery stop( ) animation (Avec paramètres)
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<script src="http://libs.baidu.com/jquery/1.10.2/jquery.min.js">
</script>
<script>
$(document).ready(function(){
$("#start").click(function(){
$("div").animate({left:'100px'},5000);
$("div").animate({fontSize:'3em'},5000);
});
$("#stop").click(function(){
$("div").stop();
});
$("#stop2").click(function(){
$("div").stop(true);
});
$("#stop3").click(function(){
$("div").stop(true,true);
});
});
</script>
</head>
<body>
<button id="start">開(kāi)始</button>
<button id="stop">停止</button>
<button id="stop2">停止所有</button>
<button id="stop3">停止動(dòng)畫(huà)，但完成動(dòng)作</button>
<p>點(diǎn)擊 "開(kāi)始" 按鈕開(kāi)始動(dòng)畫(huà)。</p>
<p>點(diǎn)擊 "停止" 按鈕停止當(dāng)前激活的動(dòng)畫(huà)，但之后我們能再動(dòng)畫(huà)隊(duì)列中再次激活。</p>
<p>點(diǎn)擊 "停止所有" 按鈕停止當(dāng)前動(dòng)畫(huà)，并清除動(dòng)畫(huà)隊(duì)列，所以元素的所有動(dòng)畫(huà)都會(huì)停止。</p>
<p>點(diǎn)擊 "停止動(dòng)畫(huà)，但完成動(dòng)作" 快速完成動(dòng)作，并停止它。</p>
<div style="background:#98bf21;height:100px;width:200px;position:absolute;">HELLO</div>
</body>
</html>Exécutez le programme et essayez-le
