本文实例讲述了JQuery常用简单动画操作方法。分享给大家供大家参考,具体如下:
hide ()
隐藏动画
,告诉()
出现动画
.toggle ()
切换显示状态
.slideUp ()/()
下拉/卷起动画
.slideToggle ()
下拉卷起切换
.fadeIn ()/()
淡入/出动画
.fadeToggle ()
淡入淡出切换
.fadeTo ()
透明度变化到指定透明度,参数为(持续时间、不透明度)
.animate ()
控制css动画,参数(属性,选项)
鸡毛蒜皮()
停止动画的执行
<强>注:强>
1,可选参数,动画持续时间及结束后的回调函数,持续时间也可以用“慢”/翱焖佟贝?例如
$ (" # t”)。隐藏(3000年,函数(){ alert("回调函数”); })//也可以用JSON格式设置参数 $ (" # t”) hide ({ 持续时间:3000 完成:函数(){ alert("回调函数”); } }) >之前2,动画中选择属性的参数有{时间宽松,一步,进步,完成}
-
<李>时间——设置动画执行的时间李>
<李>宽松——规定要使用的宽松函数,过渡使用哪种缓动函数,内置的有线性线性变化,swing曲线变化,如果需要其他变化方式需要导入库李>
<李>步骤:规定每个动画的每一步完成之后要执行的函数李>
<李>进步:每一次动画调用的时候会执行这个回调,就是一个进度的概念李>
<李>完成:动画完成回调李>
$ (" # elem”)。动画({//在现有高宽上增加100 px 宽度:“+=100 px”, 高度:“+=100 px” }, { 持续时间:5000//在5秒内执行完成 specialEasing: { 宽度:“线性”,//线性过渡效果 高度:“easeOutBounce” }, 完成:函数(){ (美元)后(' & lt; div>动画执行完毕! & lt;/div>”); } }); >之前3,停止():只会停止第一个动画,后面的继续
-
<李>停止(真正的):停止所有动画李>
<李>停止(真真正):停止动画,直接跳到第一个动画的最终状态李>
更多关于jQuery相关内容还可查看本站专题:《jQuery动画与特效用法总结》,《jQuery切换特效与技巧总结》,《jQuery扩展技巧总结》,《jQuery常用插件及用法总结》,《jQuery拖拽特效与技巧总结》,《jQuery表格(表)操作技巧汇总》、《jQuery常见经典特效汇总》及《jQuery选择器用法总结》
希望本文所述对大家jQuery程序设计有所帮助。