JQuery动画

来源:互联网 发布:info.php探针漏洞 编辑:程序博客网 时间:2024/06/07 08:11

4月7日开始记录我的JQuery的学习日记。

  使用JQuery需要先引入jq的文档,然后再在<script></script>标签中写jq语句。

$(selector).show();//显示

$(selector).hide();//隐藏

$(selector).fadeIn();//淡入

$(selector).fadeOut();//淡出

$(selector).slideDown();//下滑动

$(selector).slideUp();//上滑动

$(selector).slidetoggle();//配合click事件可实现上下滑动




jQuery 动画 - animate() 方法

jQuery animate() 方法用于创建自定义动画。

语法:
$(selector).animate({params},speed,callback);

必需的 params 参数定义形成动画的 CSS 属性。

可选的 speed 参数规定效果的时长。它可以取以下值:"slow"、"fast" 或毫秒。

可选的 callback 参数是动画完成后所执行的函数名称。



jQuery stop() 方法用于在动画或效果完成前对它们进行停止。


jQuery Callback 方法

Callback 函数在当前动画 100% 完成之后执行。
jQuery 动画的问题

许多 jQuery 函数涉及动画。这些函数也许会将 speed 或 duration 作为可选参数。

例子:$("p").hide("slow")

speed 或 duration 参数可以设置许多不同的值,比如 "slow", "fast", "normal" 或毫秒。



jQuery - 链(Chaining)

通过 jQuery,可以把动作/方法链接在一起。

Chaining 允许我们在一条语句中运行多个 jQuery 方法(在相同的元素上)。
jQuery 方法链接

直到现在,我们都是一次写一条 jQuery 语句(一条接着另一条)。

不过,有一种名为链接(chaining)的技术,允许我们在相同的元素上运行多条 jQuery 命令,一条接着另一条。

提示: 这样的话,浏览器就不必多次查找相同的元素。

如需链接一个动作,您只需简单地把该动作追加到之前的动作上。


1 0