jQuery 之路重走(6) jQuery中的动画

前言:

jQuery 中最实用之一的当然要属动画了,动画的使用简单性使得jQuery被广泛运用。 给用户一种全新的体验。


1. show() 方法和 hide() 方法

1.1 show() 和hide()不带参数时:

show() 是显示某个元素,等价于elemet.css('display','block');

hide() 是隐藏某个元素,等价于elemet.css('display','none');

jQuery 之路重走(6) jQuery中的动画_第1张图片

1.2 show() 和hide() 带参数时:

jQuery 之路重走(6) jQuery中的动画_第2张图片

2. fadeIn() 和fadeOut() 方法

这两个方法,也是显示和隐藏的动画方法,只不过,是以改变元素的不透明度,来达到动画隐藏的效果。加时间参数,也可控制速度。

jQuery 之路重走(6) jQuery中的动画_第3张图片

3. slideUp和slideDown() 方法

顾名思义,这两方法。是以只改变元素的高度,来达到显示和隐藏,形成动画的效果。


4. 最牛逼的animate() 方法

animate() 方法是jQuery 里的自定义动画方法,可以随意设置自定义动画,可以说很实用,也很牛逼。

jQuery 之路重走(6) jQuery中的动画_第4张图片

jQuery 之路重走(6) jQuery中的动画_第5张图片

jQuery 之路重走(6) jQuery中的动画_第6张图片

jQuery 之路重走(6) jQuery中的动画_第7张图片

jQuery 之路重走(6) jQuery中的动画_第8张图片

jQuery 之路重走(6) jQuery中的动画_第9张图片

jQuery 之路重走(6) jQuery中的动画_第10张图片

jQuery 之路重走(6) jQuery中的动画_第11张图片



好马虎的截图完成了,罪过啊






你可能感兴趣的:(jQuery 之路重走(6) jQuery中的动画)