jQuery动画（一）

前言

jQuery的一项很诱人的功能是可以在HTML元素上实现动画效果，例如显示、隐藏、淡入淡出和滑动等。相对于用javascript来说，用jQuery往往能事半功倍。闲话不说，开始我们今天的主题。

自定义动画

先看看咱们要实现的效果吧，这是在某个网站中搜索框的特效

怎么样，是不是似曾相识呢？

关键方法：

:产生动画效果的css属性和值。可以使用的css属性包括backgroundPosition,borderWidth,width,height,font,fontsize,bottom,left,right,top，letterSpacing，lineHeight,textIndent等

:指定动画效果运行的时间长度,单位为ms，默认值为normal(400ms)。可选值包括"slow"和"fast",也可以指定具体的数字

:指定用于设置不同动画点中动画速度的easing函数（也称动画缓冲函数）

:指定动画效果执行完后调用的函数

布局

样式

jquery

相信这些代码对于聪明的你来说简直是小菜一碟啦，如果你还不懂jquery的话，建议你应该去学习一些基本的知识。好啦，咱们看看自己实现的最终效果是怎么样的！

以动画形式显示隐藏HTML元素

关键方法

参数的意思和上面的方法是一样的哦。

,显示HTML元素,参数可选

,隐藏HTML元素,参数可选

,切换HTML元素的显示和隐藏状态,参数可选

布局

样式

jquery

效果演示

总结

其实在你访问过的网站中，随处可见jQuery的身影，它极大地简化了 JavaScript 编程，并且很容易学习。这里所列举的简单动画效果只是jQuery的冰山一角，它能做的事情非常的多！