jQuery---停止动画详解 stop();

Posted jane-panyiyun

tags:

篇首语：本文由小常识网(cha138.com)小编为大家整理，主要介绍了jQuery---停止动画详解 stop();相关的知识，希望对你有一定的参考价值。

停止动画详解 stop();

 

<!DOCTYPE html>
<html lang="zh-CN">
<head>
  <meta charset="UTF-8">
  <title>Title</title>
  <style>
    div {
      width: 400px;
      height: 400px;
      background-color: pink;
      display: none;
    }
  </style>
</head>
<body>
<input type="button" value="开始">
<input type="button" value="结束">
<div></div>

<script src="jquery-1.12.4.js"></script>
<script>
  $(function () {
    $("input").eq(0).click(function () {
      $("div").slideDown(4000).slideUp(4000);
    });
    
    
    $("input").eq(1).click(function () {
      //stop:停止当前正在执行的动画
      //clearQueue:是否清除动画队列 true  false
      //jumpToEnd:是否跳转到当前动画的最终效果 true false
      
      //.stop().animate();
      $("div").stop(true, true);
    })
  });
</script>
</body>
</html>

以上是关于jQuery---停止动画详解 stop();的主要内容，如果未能解决你的问题，请参考以下文章

jQuery 停止动画-jQuery stop()

jquery.stop()停止动画

jquery中stop停止动画笔记

关于jquery自带动画效果的stop（）问题

10.jQuery之停止动画排队stop方法（重点）

jQuery 停止动画