jQuery animate() 方法
定义和用法
animate() 方法执行一组 CSS 属性的自定义动画。
此方法使用 CSS 样式将元素从一种状态更改为另一种状态。CSS 属性值逐渐改变，以创建动画效果。
只有数字值可以被动画化（例如“margin:30px”）。字符串值不能被动画化（例如“background-color:red”），除了字符串“show”、“hide”和“toggle”。这些值允许隐藏和显示动画元素。
提示： 使用“+=”或“-=”进行相对动画。
语法
(selector).animate({styles},speed,easing,callback)
| 参数 | 描述 |
|---|---|
| styles | 必需。指定要动画化的一个或多个 CSS 属性/值。 注意： 属性名称在与 animate() 方法一起使用时必须使用驼峰命名法：您需要编写 paddingLeft 而不是 padding-left，marginRight 而不是 margin-right，等等。 可以动画化的属性
只有数字值可以被动画化（例如“margin:30px”）。字符串值不能被动画化（例如“background-color:red”），除了字符串“show”、“hide”和“toggle”。这些值允许隐藏和显示动画元素。 |
| speed | 可选。指定动画的速度。默认值为 400 毫秒 可能的值
|
| easing | 可选。指定动画不同点处的元素速度。默认值为“swing”。可能的值
|
| callback | 可选。动画完成后要执行的函数。要了解更多关于回调函数的信息，请阅读我们的 jQuery 回调函数 章节 |
备用语法
(selector).animate({styles},{options})
| 参数 | 描述 |
|---|---|
| styles | 必需。指定要动画化的一个或多个 CSS 属性/值（参见上面的可能值） |
| options | 可选。指定动画的附加选项。可能的值
|
自己尝试 - 示例
使用带回调函数的 animate()
如何使用带重复动画的回调函数的 animate()。
备用语法示例
使用备用语法来指定多个动画样式和选项。
使用 animate() 创建进度条
如何使用 animate() 方法创建进度条。
为页面锚点添加平滑滚动
如何使用 animate() 为链接添加平滑滚动。
