jQuery中常用动画效果函数知识点整理

jQuery的效果函数列表:

animate():对被选元素应用“自定义”的动画。

clearQueue():对被选元素移除所有排队的函数(仍未运行的)。

delay():对被选元素的所有排队函数(仍未运行)设置延迟。

dequeue():运行被选元素的下一个排队函数。

fadeln():逐渐改变被选元素的不透明度,从隐藏到可见。

fadeOut():逐渐改变被元素的不透明度,从可见到隐藏。

fadeTo():把被选元素逐渐改变至给定的不透明度。

hide():隐藏被选的元素。

queue():显示被选元素的排队函数。

show():显示被选的元素。

slideDown():通过调整高度来滑动显示被选元素。

slideToggle():对被选元素进行滑动隐藏和滑动显示的切换。

slideUp():通过调整高度来滑动隐藏被选元素。

stop():停止在被选元素上运行的动画。

toggle():对被选元素进行隐藏和显示的切换。

animate():

animate() 方法执行 CSS 属性集的自定义动画。

该方法通过CSS样式将元素从一个状态改变为另一个状态。CSS属性值是逐渐改变的,这样就可以创建动画效果。

只有数字值可创建动画(比如 "margin:30px")。字符串值无法创建动画(比如 "">  clearQueue():

clearQueue() 方法停止队列中所有仍未执行的函数。

与 stop() 方法不同,(只适用于动画),clearQueue() 能够清除任何排队的函数(通过 .queue() 方法添加到通用 jQuery 队列的任何函数)。

delay():

delay():对被选元素的所有排队函数(仍未运行)设置延迟。

dequeue():

dequeue():运行被选元素的下一个排队函数。

fadeIn():

fadeIn() 方法使用淡入效果来显示被选元素,假如该元素是隐藏的。

fadeOut():

fadeOut() 方法使用淡出效果来隐藏被选元素,假如该元素是隐藏的。

fadeTo():

fadeTo() 方法将被选元素的不透明度逐渐地改变为指定的值。

hide():

如果被选的元素已被显示,则隐藏该元素。

queue():

queue():显示被选元素的排队函数。

show():

如果被选元素已被隐藏,则显示这些元素。

slideDown():

slideDown() 方法通过使用滑动效果,显示隐藏的被选元素。

slideToggle() :

slideToggle() 方法通过使用滑动效果(高度变化)来切换元素的可见状态。

如果被选元素是可见的,则隐藏这些元素,如果被选元素是隐藏的,则显示这些元素。

slideUp():

通过使用滑动效果,隐藏被选元素,如果元素已显示出来的话。

stop():

stop() 方法停止当前正在运行的动画。

toggle():

toggle() 方法切换元素的可见状态。

(0)

相关推荐

  • jQuery中map函数的两种方式

    两种方式: 1.直接jQuery.map //将原数组中每个元素加 4 转换为一个新数组. $.map( [0,1,2], function(n){ return n + 4; }); //结果: [4, 5, 6] //原数组中每个元素扩展为一个包含其本身和其值加 1 的数组,并转换为一个新数组 $.map( [0,1,2], function(n){ return [ n, n + 1 ]; }); //结果: [0, 1, 1, 2, 2, 3] 2.遍历对象.map 例子: <form

  • jquery中封装函数传递当前元素的方法示例

    最近在工作中遇到一个问题,需要对页面上一组元素进行ajax操作,结构如下: <div id="aid"></div> <div id="aid"></div> <div id="aid"></div> <div id="aid"></div> <div id="stop">Stop here</

  • 基于jquery trigger函数无法触发a标签的两种解决方法

    起因:点击icon图标后要触发a标签的链接转跳动作,但是用 JQ 的 $('#a').trigger('click') 居然不起作用,遂百度之,总结两种方法如下: (原因:JQ 的 trigger() 方法确实无法触发 a 标签的转跳动作.) 1:JQ 方法: 对目标 a 标签内部新增一个 span 标签 ,然后给 span 标签绑定 trigger('click') 事件. $('#a').html('<span></span>').children().trigger('cli

  • jquery的$().each和$.each的区别

    $(selector).each(function(index,element)) 这个函数和之前项目里面用到的遍历数据的函数不是同一个呀(项目里面用到的函  数:$.each(dataresource,function(index,element))),于是,就好好研究了下,果然在JS里面有两个相似的函数,于是也就有了今天的主题:  1.$(selector).each(function(index,element))  2.$.each(dataresource,function(index

  • jQuery使用bind函数实现绑定多个事件的方法

    本文实例讲述了jQuery使用bind函数实现绑定多个事件的方法.分享给大家供大家参考,具体如下: 在jQuery中绑定多个事件名称是,使用空格隔开,举例如下: $("#foo").bind("mouseenter mouseleave", function() { $(this).toggleClass("entered"); }); 在1.4版本以后,也可以如下绑定 $("#foo").bind({ click: func

  • jquery中用函数来设置css样式

    1.jquery语法 $(selector).css(name,function(index,value)) name:必需.规定 CSS 属性的名称 function(index,value) : 规定返回CSS属性新值的函数. index - 可选.接受选择器的index位置 value - 可选.接受CSS属性的当前值 2.function(index,value)的用途 相当于对通过选择符"selector"选择到的所有对象进行一次遍历,并设置相应的css属性值,其中index

  • JavaScript自执行函数和jQuery扩展方法详解

    我们通常将JS代码写在一个单独的JS文件中,然后在页面中引入该文件.但是,有时候引入后会碰到变量名或函数名与其它JS代码冲突的问题.那么如何解决这个问题呢?作用域隔离.在JS中,作用域是通过函数来划分的,将JS代码封装到函数中进行调用可以避免变量名/函数名冲突的问题,但是这也并不是万无一失,因为封装函数本身有可能和其它函数重名,解决方案:自执行函数. 自执行函数是用一对圆括号将匿名函数包起来,加括号(传参)会立即执行.因为函数无名字,实现了作用域的绝对隔离和函数名的冲突问题.基本形式如下: (f

  • jQuery实现ajax回调函数带入参数的方法示例

    本文实例讲述了jQuery实现ajax回调函数带入参数的方法.分享给大家供大家参考,具体如下: 不带参数的写法: function pass(htmlId,auditingFlag){ var url = 'ad_auditing.action'; var params = { 'adInfoPOJO.auditingFlag' : auditingFlag }; dataType: "text"; jQuery.post(url, params, callbackFun); } //

  • 解决jquery有正确返回值但不执行success函数的问题

    从后台返回的结果是这样的:{"readyState":4,"responseText":"success", "status":200, "statusText":"OK"} 前端代码 $.ajax({ url:'save', type:'POST', dataType:'json', contentType:'application/json', data:JSON.stringify

  • jQuery.parseHTML() 函数详解

    定义和用法 $.parseHTML() 函数用于将HTML字符串解析为对应的DOM节点数组. 注意: 1. 该函数将使用原生的DOM元素创建函数把HTML字符串转换为一个DOM元素的集合,你可以将这些DOM元素插入到文档中. 2. 如果没有指定context参数,或该参数为null或undefined,则默认为当前document.如果创建的DOM元素用于另一个文档,例如iframe,则应该指定该iframe的document对象. 安全考虑:大多数jQuery API都允许HTML字符串在HT

随机推荐