一. 在使用animate()的时候 前面需要加上.stop()来防止移进移出的山东问题。

二.

   

1.定义: stop() 方法为被选元素停止当前正在运行的动画。

2.语法:  $(selector).stop(stopAll,goToEnd)

           参数:

                   stopAll     : 可选。规定是否停止被选元素的所有加入队列的动画。默认是 false。

                   goToEnd  : 可选。 规定是否立即完成当前的动画。 默认是false。 该参数只有 在设置了stopAll参数时才能使用。

第一个参数的意思是 是否清空动画序列, 也就是停止的是当前元素的动画效果还是后面附带的所有动画的效果,一般为false,跳过当前的动画效果,执行下一个动画效果。

第二个参数的意思是 是否将当前的动画进行到最后,意思就是 停止当前动画的时候动画效果刚好执行了一半,这个时候想要的是动画执行之后的效果,那么这个参数就为true。否则动画效果就会停在stop执行的时候。

   
 <!DOCTYPE html>
<html>
<head>
<meta charset='utf-8'>
<title>stop的用法案例</title>
<style type="text/css">
#animater{
width: 150px;
background:activeborder;
border: 1px solid black;
/*为了移动,需设置此属性*/
position: relative;
}
</style>
<script type="text/javascript" src='/style/js/jquery-1.10.2.min.js'></script>
<script type="text/javascript">
$(function(){
$("#start").click(function(){
$("#box").animate({height:},"slow");
$("#box").animate({width:},"slow");
$("#box").animate({height:},"slow");
$("#box").animate({width:},"slow");
});
// 点击不同的button执行不同的操作
$('#button1').click(function(){
//默认参数是false,不管写一个false还是两个false还是没写false效果一样
$('#box').stop();
});
$('#button2').click(function(){
//第二个参数默认false
$('#box').stop(true);
});
$('#button3').click(function(){
$('#box').stop(false,true);
});
$('#button4').click(function(){
$('#box').stop(true,true);
});
})
</script>
</head>
<body>
<p><input type='button' value='开始测试' id='start'></p>
<div id="button">
<input type="button" id="button1" value="stop()"/>
<input type="button" id="button2" value="stop(true)"/>
<input type="button" id="button3" value="stop(false,true)"/>
<input type="button" id="button4" value="stop(true,true)"/>
</div>
<div id="box" style="background:#98bf21;height:100px;width:100px;position:relative">stop运动参数测试</div>
</body>
</html>

随机推荐

  1. hibernate的1+n

    对数据库访问还是必须考虑性能问题的, 在设定了1 对多这种关系之后, 查询就会出现传说中的n +1 问题. 1 )1 对多,在1 方,查找得到了n 个对象, 那么又需要将n 个对象关联的集合取出,于是 ...

  2. string的实现

    面试常常用到string类的实现,自己总结了一下: #pragma once #include <iostream> #include <cassert> #include & ...

  3. golang实现冒泡排序

    //BubbleSort.go package main import "fmt" func main() { , , , , , , , , ,} fmt.Println(val ...

  4. 设置Windows 7 防火墙端口规则

    http://jingyan.baidu.com/article/c843ea0b7d5c7177931e4ab1.html?qq-pf-to=pcqq.c2c 主要解决手机访问pc站点的问题(pc和 ...

  5. 我的PHP编程环境变迁:notepad -> notepad++ -> Sublime Text2 -> PhpStorm

    10多年前最一开始写PHP程序的时候是用windows自带的notepad,现在想来真的很屌丝. 后来经人推荐换成了notepad++,感觉还是相当不错的(中间还用过一阵子editplus). 比较喜 ...

  6. 一些Layout的坑。坑死我自己了

    iOS这个东西,初学感觉,还好还好,然后一年之后再来修复一下初学的时候的代码,我只是感觉头很晕- - 别扶我. AutoLayout的坑,明明以前都没有的!!!升了iOS10就突然发现了这个坑,其实也 ...

  7. unix basic command

    1. get start Command Example Description ls ls ls -a ls -l 输出目录文件 输出文件包括隐藏文件 输出文件详细信息 pwd pwd show p ...

  8. JS生成二维码,允许中文转码

    一.使用jquery-qrcode生成二维码 先简单说一下jquery-qrcode,这个开源的三方库(可以从https://github.com/jeromeetienne/jquery-qrcod ...

  9. Java SCP copy local file to remote implementation

    最近做的项目中,有一个小需求,需要通过SCP把本地文件copy到远程服务器.查了好多资料,最终解决方案简单快速,分享一下. 在这里,需要用到4个jar包,分别是ant-jsch.jar,ant-lau ...

  10. 用jQuery做一个三级菜单,鼠标移动到二级菜单的选项上,然后再迅速离开后,当鼠标再移动到该一级菜单或其他二级菜单选项,三级菜单也会显示。

    用jQuery做一个三级菜单,鼠标移动到二级菜单的选项上,然后再迅速离开后,当鼠标再移动到该一级菜单或其他二级菜单选项,三级菜单也会显示. 原因:在为一个元素绑定hover事件之后,用户把光标移入元素 ...