http://www.sufeinet.com/plugin.php?id=keke_group

苏飞论坛

 找回密码
 马上注册

QQ登录

只需一步,快速开始

分布式系统框架(V2.0) 轻松承载百亿数据,千万流量!讨论专区 - 源码下载 - 官方教程

HttpHelper爬虫框架(V2.7-含.netcore) HttpHelper官方出品,爬虫框架讨论区 - 源码下载 - 在线测试和代码生成

HttpHelper爬虫类(V2.0) 开源的爬虫类,支持多种模式和属性 源码 - 代码生成器 - 讨论区 - 教程- 例子

查看: 5192|回复: 1

[零基础学习web前端] 【零基础学习web前端】jQuery 停止动画

[复制链接]
发表于 2019-1-18 16:23:26 | 显示全部楼层 |阅读模式
【零基础学习web前端】jQuery 停止动画

【零基础学习web前端】教程目录导航


jQuery stop() 方法用于在动画或效果完成前对它们进行停止。


jQuery stop() 方法
jQuery stop() 方法用于停止动画或效果,在它们完成之前。
stop() 方法适用于所有 jQuery 效果函数,包括滑动、淡入淡出和自定义动画。

语法:
$(selector).stop(stopAll,goToEnd);
可选的 stopAll 参数规定是否应该清除动画队列。默认是 false,即仅停止活动的动画,允许任何排入队列的动画向后执行。
可选的 goToEnd 参数规定是否立即完成当前动画。默认是 false。
因此,默认地,stop() 会清除在被选元素上指定的当前动画。

实例:
[JavaScript] 纯文本查看 复制代码
<html lang="en">
<head>
  <meta charset="UTF-8">
  <meta name="viewport" content="width=device-width, initial-scale=1.0">
  <meta http-equiv="X-UA-Compatible" content="ie=edge">
  <title>Document</title>
  <style>
  #box,#content{
    width: 500px;
    line-height: 30px;
    text-align: center;
    background:#e5eecc;
    border: 1px solid #e5e5e5;
  }
  #content{
    height: 200px;
    display: none;
  }
</style>
</head>
<body>
  <button id="btn">停止</button>
  <div id="box">点击此处,向下滑动</div>
  <div id="content">苏飞论坛</div>
  <script src="jquery.js"></script>
  <script>
    $(document).ready(function(){
      $('#box').click(function(){
        $('#content').slideDown(5000);
      }) ;
      $('#btn').click(function(){
        $('#content').stop();
      })
    })
</script>
</body>
</html>

效果:
12.gif


1. 开通SVIP会员,免费下载本站所有源码,不限次数据,不限时间
2. 加官方QQ群,加官方微信群获取更多资源和帮助
3. 找站长苏飞做网站、商城、CRM、小程序、App、爬虫相关、项目外包等点这里
发表于 2019-1-18 17:31:38 | 显示全部楼层
我只是路过打酱油的。
您需要登录后才可以回帖 登录 | 马上注册

本版积分规则

QQ|手机版|小黑屋|手机版|联系我们|关于我们|广告合作|苏飞论坛 ( 豫ICP备18043678号-2)

GMT+8, 2024-11-8 02:41

© 2014-2021

快速回复 返回顶部 返回列表