1.animate();开始动画
使用方法:
$(selector).animate({params},speed,callback);
必需的 params 参数定义形成动画的 CSS 属性。
可选的 speed 参数规定效果的时长。它可以取以下值:"slow"、"fast" 或毫秒。
可选的 callback 参数是动画完成后所执行的函数名称。
2. stop():停止动画
默认地,所有 HTML 元素都有一个静态位置,且无法移动。
如需对位置进行操作,要记得首先把元素的 CSS position 属性设置为 relative、fixed 或 absolute!布局如下:
<body>
<button id="start">开始动画</button>
<button id="stop">停止动画</button>
<div style="width: 100px;height: 100px;background: red;position: relative;">我是div</div>
</body>
animate()方法可以操作多个属性,他几乎可以操作所有的css属性,但是有一点要指出当使用 animate() 时,必须使用 Camel 标记法书写所有的属性名,比如,必须使用 paddingLeft 而不是 padding-left,使用 marginRight 而不是 margin-right,等等。实现动画的代码如下: