位置: 编程技术 - 正文

详解jQuery停止动画——stop()方法的使用(jquery 控制暂停和播放)

编辑:rootadmin

推荐整理分享详解jQuery停止动画——stop()方法的使用(jquery 控制暂停和播放),希望有所帮助,仅作参考,欢迎阅读内容。

文章相关热门搜索词:jquery结束方法,jquery停止动画,jquery定时器暂停,jquery关闭页面,js 停止,jquery结束方法,jquery结束方法,jquery中停止动画使用什么方法,内容如对您有帮助,希望把文章链接给更多的朋友!

很多时候需要停止匹配元素正在进行的动画,比如,当鼠标选入元素时显示菜单,鼠标离开时隐藏下拉菜单,如果鼠标移入移出过快的话就会导致动画效果与鼠标的动作不一致的情况,此时stop()就派上用场了。

stop()方法的语法结构为:

stop([clearQueue],[gotoEnd]);

参数clearQueue和gotoEnd都是可选参数,为Boolean值(true或false)。clearQueue代表是否清空未执行完的动画队列,gotoEnd代表是否直接将正在执行的动画跳转到末状态。

(1)直接使用使用stop()方法,则会立即停止当前正在进行的动画,如果接下来还有动画等待继续进行,则以当前状态开始接下来的动画。比如下面例子:

此时,在光标移入时,触发光标移入动画(在0.2秒内height变为),在动画还没执行完的时候光标移出,则停止当前动画(可能height还未到达),执行光标移出触发的动画(在0.3秒内height变回)。反之亦然。

详解jQuery停止动画——stop()方法的使用(jquery 控制暂停和播放)

如果遇到组合动画,例如:

此时只用一个不带参数的stop()方法就显得力不从心了。因为stop()方法只会停止正在进行的动画,如果动画正执行在第1阶段(改变height的阶段),则触发光标移出事件后,只会停止当前的动画,并继续进行下面的.animate({width: ""},)动画,而光标移出事件中的动画要等这个动画结束后才会继续执行,这显然不是预期的结果。这种情况下stop()方法的第一个参数就发挥作用了。

(2)stop(true),此时程序会把当前元素接下来尚未执行完的动画队列清空。所以可以把上面代码改成如此代码,就能实现预期的效果。

(3)第2个参数(gotoEnd)可以用于让正在执行的动画直接到达结束时刻的状态,通常用于后一个动画需要基于前一个动画的末状态的情况,可以通过stop(false,true)这种方式来让当前动画直接到达末状态。

(4)两者结合起来stop(true,true),即停止当前动画并直接到达当前动画的末状态,并清空动画队列。

(5)注意,jQuery只能设置正在执行的动画的最终状态,而没有提供直接到达执行动画队列最终状态的方法。例如有一组动画:

无论怎么设置stop()方法,均无法再改变"width"或者"height"时,将此<div>元素的末状态变成*大小,并且设置透明度为0.2。

温馨提示:

jQuery中的动画有show()、hide()、fadeIn()、fadeOut()、slideDown()、slideUp()、animate()等等。stop()方法对上述的动画都适用。

标签: jquery 控制暂停和播放

本文链接地址:https://www.jiuchutong.com/biancheng/373919.html 转载请保留说明!

上一篇:详解jQuery中基本的动画方法(jquery基础知识)

下一篇:详解jQuery中的事件(jquery1)

  • 出口退税的条件有哪些
  • 嵌入式软件产品的增值税即征即退具体实例
  • 计提税金账务处理
  • 房地产企业年报台账怎么填
  • 企业从银行借款归还应付账款
  • 农民合作社交哪些税
  • 退增值税需要多久
  • 计提增值税怎么计提
  • 出口转内销增值税报表怎么填
  • 一般纳税人交增值税会计科目
  • 信用卡产生滞纳金
  • 民非企业缴纳社保会计分录
  • 衍生金融资产的核算
  • 施工单位企业税率是多少
  • 个体户经营所得怎么申报
  • 发票显示上传失败
  • 提供出口收汇核算方法
  • 折价股权转让账务处理
  • 固定资产替换公式
  • 税控盘登不上怎么回事
  • 未开票收入必须全部转开票收入吗为什么
  • 预付款和进度款支付有冲突吗
  • 分期收款销售的商品属于存货吗
  • win10怎么建立多个用户
  • 待清算专户
  • win10电脑文件夹打不开
  • window10专业版2021
  • 微软 Windows x64 仿真正式推出,只支持 Win11 ARM
  • 所得税时间性差异与暂时性差异
  • h5响应式布局是什么
  • 外商投资企业采用交易发生日的即期汇率
  • php 正则函数
  • 瓦尔加德
  • vue中的组件有几类
  • 目前税收工作中存在的主要问题及对策
  • 固定资产折旧提完后只剩净残值
  • vue-nginx刷新404问题
  • react devtools
  • php框架symfony
  • 私车公用可以报销哪些费用
  • 会计核算方式有几种
  • 综合所得汇算清缴是什么意思
  • 申报抵扣了不做账怎么处理?
  • 出口退回的增值税计入哪个会计科目
  • 公允价值变动损益
  • 私人借款条怎么写合法
  • 备用金账目处理
  • 审车费用表
  • 研发样品是什么费用
  • 退回的企业所得税计入什么科目
  • 事业单位可以报考事业单位吗
  • 房地产开发企业资质管理规定
  • php连接mysql的步骤代码
  • mysql实用教程
  • win7旗舰版系统激活码
  • win10无法新建文件夹怎么办?(已解决)
  • Vista下以真正的管理员登陆的设置方法
  • vista升级选项灰色
  • win2008如何安装telnet
  • unix操作系统有哪些主要特色
  • bios设置u盘启动顺序
  • 苹果系统怎么修改位置
  • 系统装在从盘
  • retrorun.exe - retrorun有什么用 是什么进程
  • win7怎么升级到win10系统软件还在吗
  • 通知栏图标怎么变小
  • linux修改时间和日期的方法
  • 桌面预览怎么设置
  • win10系统出现问题怎么办
  • cocos2d getPosition()取不到实际坐标问题
  • ecxel进度条
  • Android游戏开发案例教程小小弹球
  • linux查找占用磁盘最大文件
  • unity怎么把文件导入项目
  • pm2启动nodejs
  • 夯实基础怎么读
  • 安卓手机怎么导入地图
  • js闭包详解
  • 就业核查怎么核查
  • 新能源车需要缴纳购置税吗?
  • 免责声明:网站部分图片文字素材来源于网络,如有侵权,请及时告知,我们会第一时间删除,谢谢! 邮箱:opceo@qq.com

    鄂ICP备2023003026号

    网站地图: 企业信息 工商信息 财税知识 网络常识 编程技术

    友情链接: 武汉网站建设