Jquery1.9.1源码分析系列(十五)动画处理之外篇(2)

jQuery.fn.show([ duration ] [, easing ] [, complete ] | options )(显示所有匹配的元素。此外,你还可以指定元素显示的过渡动画效果。如果元素本身是可见的,则不对其作任何改变。如果元素是隐藏的,则使其可见。与该函数相对的是hide()函数,用于隐藏所有匹配的元素)

jQuery.fn.hide([ duration ] [, easing ] [, complete ] | options)(隐藏所有匹配的元素。此外,你还可以指定元素隐藏的过渡动画效果。如果元素本身是不可见的,则不对其作任何改变。如果元素是可见的,则将其隐藏。)

jQuery.fn.toggle([ duration ] [, easing ] [, complete ] | options)(切换所有匹配的元素。此外,你还可以指定元素切换的过渡动画效果。所谓"切换",也就是如果元素当前是可见的,则将其隐藏;如果元素当前是隐藏的,则使其显示(可见)。)

这里介绍的toggle()函数用于切换元素的显示/隐藏。jQuery还有一个同名的事件函数toggle(),用于绑定click事件并在触发时轮流切换执行不同的事件处理函数。

jQuery.fn.slideDown([ duration ] [, easing ] [, complete ] | options)(显示所有匹配的元素,并带有向下滑动的过渡动画效果。向下滑动的动画效果,即元素可见区域的高度从0逐渐增大到其原有高度(向下逐渐展开)。如果元素本身是可见的,则不对其作任何改变。如果元素是隐藏的,则使其可见。

与该函数相对的是slideUp()函数,用于隐藏所有匹配的元素,并带有向上滑动的过渡动画效果)

jQuery.fn.slideUp([ duration ] [, easing ] [, complete ] | options)(隐藏所有匹配的元素,并带有向上滑动的过渡动画效果。向上滑动的动画效果,即元素可见区域的高度从原有高度逐渐减小到0(向上逐渐收起)。如果元素本身是隐藏的,则不对其作任何改变。如果元素是可见的,则将其隐藏)

jQuery.fn.slideToggle([ duration ] [, easing ] [, complete ] | options)(切换所有匹配的元素,并带有滑动的过渡动画效果。所谓"切换",也就是如果元素当前是可见的,则将其隐藏(向上滑动);如果元素当前是隐藏的,则使其显示(向下滑动))

jQuery.fn.fadeIn([ duration ] [, easing ] [, complete ] | options)(显示所有匹配的元素,并带有淡入的过渡动画效果。淡入的动画效果,即元素的不透明度的比例从0%逐渐增加到100%。如果元素本身是可见的,则不对其作任何改变。如果元素是隐藏的,则使其可见。与该函数相对的是fadeOut()函数,用于隐藏所有匹配的元素,并带有淡出的过渡动画效果)

jQuery.fn.fadeOut([ duration ] [, easing ] [, complete ] | options)(隐藏所有匹配的元素,并带有淡出的过渡动画效果。所谓"淡出"的动画效果,即元素的不透明度的比例从100%逐渐减小到0%。如果元素本身是隐藏的,则不对其作任何改变。如果元素是可见的,则将其隐藏)

jQuery.fn.fadeToggle([ duration ] [, easing ] [, complete ] | options)(切换所有匹配的元素,并带有淡入/淡出的过渡动画效果。所谓"切换",即如果元素当前是可见的,则将其隐藏(淡出);如果元素当前是隐藏的,则使其显示(淡入))

jQuery.fn.animate(cssProperties [, duration ] [, easing ] [, complete ] | cssProperties, options)(执行一个基于css属性的自定义动画。你可以为匹配的元素设置css样式,animate()函数将会执行一个从当前样式到指定的css样式的一个过渡动画。例如:某个div元素的当前高度为100px,将其CSS height属性设为200px,animate()将会执行一个将div元素的高度从100px逐渐增加到200px的过渡动画)

jQuery.fn.delay(duration [, queueName ])(延迟队列中下一项的执行。delay()可以将队列中等待执行的下一个动画延迟指定的时间后才执行。它常用在队列中的两个jQuery效果函数之间,从而在上一个动画效果执行后延迟下一个动画效果的执行时间。如果下一项不是效果动画,则它不会被加入效果队列中,因此该函数不会对它进行延迟调用)

jQuery.fn.stop([ queueName ] [, clearQueue [, jumpToEnd ] ])(停止当前匹配元素上正在运行的动画。默认情况下,stop()函数只会停止当前正在运行的动画。如果你使用animate()函数为当前元素设置了A、B、C这3段动画,如果当前正在执行的动画是A,则只会停止动画A的执行,不会阻止动画B和C的执行。当然,你也可以通过指定可选的选项参数来停止所有的动画。停止动画并不是恢复到该动画执行前的状况,而是直接停止,当前动画执行到什么状态,就停留在什么状态。例如:执行一个元素高度从100px到200px的过渡动画,当高度为150px时停止了该动画,则当前高度仍然保持150px的现状。如果该动画设置了执行完毕后的回调函数,则不会执行该回调函数。)

内容版权声明:除非注明,否则皆为本站原创文章。

转载注明出处:https://www.heiqu.com/wgzzwf.html