jquery中animate的stop()方法作用实例分析
更新时间：2015年01月30日 09:52:37 投稿：shichen2014
这篇文章主要介绍了jquery中animate的stop()方法作用,实例分析了animate的stop()方法在视频播放代码中的使用技巧,感兴趣的朋友可以对比分析一下带stop方法与不带stop方法运行效果的区别,需要的朋友可以参考下
本文实例分析了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程序设计有所帮助。
相关文章
在本篇内容里小编给大家分享了jQuery获取特殊属性的值以及设置内容相关知识点，有需要的朋友们参考下。2018-11-11
本篇文章主要是对jQuery中live与bind方法的区别进行了详细的分析介绍，需要的朋友可以过来参考下，希望对大家有所帮助2013-12-12
jQuery prototype冲突的2种解决方法(附demo示例下载)
这篇文章主要介绍了jQuery prototype冲突的2种解决方法,分析了针对jQuery中添加代码与冲突位置添加代码2种情况,并附带demo示例供读者下载参考,需要的朋友可以参考下2016-01-01
使用ajax实现文件下载，方便，快捷，时尚，多么有挑战的一个功能，首先获取url和data然后把参数组装成form的input再利用request发送请求，也就是动态渲染表单，提交表单后再删除，本例将实现文件下载功能，感兴趣的朋友可以聊解下2013-01-01
这篇文章主要介绍了jQuery实现感应鼠标动画效果自动伸长的输入框,实例分析了jQuery鼠标事件及animate动画效果的使用技巧,具有一定参考借鉴价值,需要的朋友可以参考下2015-02-02
这篇文章主要为大家详细介绍了jquery插件uploadify多图上传功能实现代码，具有一定的参考价值，感兴趣的小伙伴们可以参考一下2016-08-08
jQuery:delegate中select()不起作用的解决方法(实例讲解)
本篇文章只要是对jQuery:delegate中select()不起作用的解决方法进行了详细的介绍，需要的朋友可以过来参考下，希望对大家有所帮助2014-01-01
jquery validate和jquery form 插件组合实现验证表单后AJAX提交
在ajax流行的时代，好像很少能看见传统的同步提交表单方式了，是啊我们当然要用更加给力的AJAX来实现异步无刷新提交表单，好了开始今天的jQuery之旅吧，今天我们来利用jquery.validate和jquery.form 插件组合实现验证表单后AJAX提交 ，需要的朋友可以参考下2015-08-08
这篇文章主要介绍了jQuery中next方法用法,实例分析了jQuery中next方法的功能、定义及相关使用技巧,需要的朋友可以参考下2015-04-04
jQuery是继prototype 之后的又一个优秀的Javascript框架，本篇文章给大家分享收藏的jquery技巧，对jquery技巧相关知识感兴趣的朋友一起学习吧2015-12-12
最新评论