jquery中animate的stop()方法作用实例分析


Posted in Javascript onJanuary 30, 2015

本文实例分析了jquery中animate的stop()方法作用。分享给大家供大家参考。具体分析如下:

这里以一个视频中的代码段告诉你stop()的作用:

代码如下:

<style type="text/css"> 
ul li{ width:50px; height:30px; background:#333; margin-bottom:10px; color:#fff;} 
</style> 
<ul id="flyul"> 
<li>wod a </li> 
<li>wod a </li> 
<li>wod a </li> 
<li>wod a </li> 
<li>wod a </li> 
</ul> 
<script type="text/javascript" src="js/jquery-1.7.2.min.js"></script> 
<script type="text/javascript"> 
$('#flyul li').mouseenter(function(){ 
$(this).stop().animate({
//将此处改为$(this).animate({对比一下不带stop的运行效果
width:'300px' 
},1000); 
}); 
$('#flyul li').mouseleave(function(){ 
$(this).stop().animate({
//将此处改为$(this).animate({对比一下不带stop的运行效果
width:'50px' 
},1000); 
}); 
</script>

希望本文所述对大家的jQuery程序设计有所帮助。

Javascript 相关文章推荐
javascript 的Document属性和方法集合
Jan 25 Javascript
javascript监听鼠标滚轮事件浅析
Jun 05 Javascript
javascript快速排序算法详解
Sep 17 Javascript
JavaScript实现Java中StringBuffer的方法
Feb 09 Javascript
JQUERY实现网页右下角固定位置展开关闭特效的方法
Jul 27 Javascript
javascript实现数字倒计时特效
Mar 30 Javascript
jquery滚动条插件(可以自定义)
Dec 11 Javascript
JS实现模糊查询带下拉匹配效果
Jun 21 Javascript
layui-laydate时间日历控件使用方法详解
Nov 15 Javascript
36个正则表达式(开发效率提高80%)
Nov 17 Javascript
Vue+Flask实现图片传输功能
Apr 01 Vue.js
小程序自定义轮播图圆点组件
Jun 25 Javascript
javascript中sort()的用法实例分析
Jan 30 #Javascript
JavaScript中的值是按值传递还是按引用传递问题探讨
Jan 30 #Javascript
javascript结合fileReader 实现上传图片
Jan 30 #Javascript
使用JavaScript+canvas实现图片裁剪
Jan 30 #Javascript
js判断手机和pc端选择不同执行事件的方法
Jan 30 #Javascript
项目中常用的JS方法整理
Jan 30 #Javascript
jQuery实现带滚动线条导航效果的方法
Jan 30 #Javascript
You might like
PHP spl_autoload_register实现自动加载研究
2011/12/06 PHP
PHP文件读写操作相关函数总结
2014/11/18 PHP
thinkphp查询,3.X 5.0方法(亲试可行)
2017/06/17 PHP
PDO::getAttribute讲解
2019/01/28 PHP
使两个iframe的高度与内容自适应,且相等
2006/11/20 Javascript
使用Java实现简单的server/client回显功能的方法介绍
2013/05/03 Javascript
JS 打印界面的CSS居中代码适用所有浏览器
2014/03/19 Javascript
javascript操纵OGNL标签示例代码
2014/06/16 Javascript
jQuery源码分析之jQuery中的循环技巧详解
2014/09/06 Javascript
12306验证码破解思路分享
2015/03/25 Javascript
JS实现环形进度条(从0到100%)效果
2016/07/05 Javascript
浅析jQuery操作select控件的取值和设值
2016/12/07 Javascript
nodejs个人博客开发第五步 分配数据
2017/04/12 NodeJs
D3.js实现拓扑图的示例代码
2018/06/30 Javascript
element-ui使用导航栏跳转路由的用法详解
2018/08/22 Javascript
webpack4 optimization使用总结
2019/11/10 Javascript
vue通过v-html指令渲染的富文本无法修改样式的解决方案
2020/05/20 Javascript
基于Ionic3实现选项卡切换并重新加载echarts
2020/09/24 Javascript
[01:45]2014DOTA2 TI预选赛预选赛 战前探营!
2014/05/21 DOTA
python3编写C/S网络程序实例教程
2014/08/25 Python
Python二维码生成库qrcode安装和使用示例
2014/12/16 Python
python实现在sqlite动态创建表的方法
2015/05/08 Python
用Pycharm实现鼠标滚轮控制字体大小的方法
2019/01/15 Python
Python获取好友地区分布及好友性别分布情况代码详解
2019/07/10 Python
Python zip函数打包元素实例解析
2019/12/11 Python
Python是什么 Python的用处
2020/05/26 Python
利用CSS3实现动态的二级三级菜单效果实例源码
2017/01/04 HTML / CSS
高性能钓鱼服装:Huk Gear
2019/02/20 全球购物
澳大利亚儿童鞋在线:The Trybe
2019/07/16 全球购物
前台接待的工作职责
2013/11/21 职场文书
保护环境倡议书300字
2014/05/19 职场文书
求职简历自荐信怎么写
2015/03/26 职场文书
初中教师德育工作总结2015
2015/05/12 职场文书
致创业您:正能量激励人心句子(48条)
2019/08/15 职场文书
vue3引入highlight.js进行代码高亮的方法实例
2022/04/08 Vue.js
python和C/C++混合编程之使用ctypes调用 C/C++的dll
2022/04/29 Python