标题 | jquery简单特效2 |
内容 | jquery第十七课,jquery特效处理2,对象的淡入淡出,还有就是自定义动画效果.这个自定义就得靠自己的脑子编特效了. 参考共用代码 <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.0 Transitional//EN"> <HTML><HEAD><TITLE>jquery特效处理</TITLE> <script language="javascript" src="jquery-1.4.2.min.js"></script> <SCRIPT language="javascript"> $(function(){ <!--www.forasp.cn jquery代码区--> }); </SCRIPT> <BODY> <div id="www">网站制作学习网> <div id="foraspcn">jquery特效处理</div> </BODY> </HTML> 3.淡入淡出效果. (1).fadeIn(speed,[callback]);通过不透明度的变化来实现所有匹配元素的淡入效果,并在动画完成后可选地触发一个回调函数.speed跟上一节一样有常规的"slow"0.6s,"normal"0.4s和"fast"0.2s.(下面的都一样),元素的其他属性不变. jQuery实例:$("#www").fadeIn("slow");试试看,这样"网站制作学习网",由不显示(透明)逐渐变成显示(不透明)(0.6s). $("#www").fadeIn("slow",function(){alert("网站制作学习网显示完毕")});当显示完成后,弹出"网站制作学习网显示完毕"对话框 (2).fadeOut(speed,[callback]);通过不透明度的变化来实现所有匹配元素的淡出效果,并在动画完成后可选地触发一个回调函数,参数同上. jQuery实例:$("#foraspcn").fadeOut(5000,function(){alert("特效fadeOut执行完毕")}); 效果5秒,jquery特效处理层从显示(不透明)到不显示(透明).完毕后弹出对话框. (3).fadeTo(speed,opacity,[callback]);把所有匹配元素的不透明度以渐进方式调整到指定的不透明度,并在动画完成后可选地触发一个回调函数。参数同上.opacity表示透明度从0-1;0表示透明(不显示),1表示不透明(显示).比如0.5也就是透明度50%. jQuery实例:$("#foraspcn").fadeTo("slow",0.5,function(){alert("变成半透明了把!")}); 4.创建自定义动画 (1).animate(params, [duration], [easing], [callback]);用于创建自定义动画的函数<网站制作学习网Foasp.cn> 参数介绍: params:一组包含作为动画属性和终值的样式属性和及其值的集合 比如{height:"100px",width:"200px"} duration:也就是上面的speed,三种预定速度之一的字符串("slow", "normal", or "fast")或表示动画时长的毫秒数值(如:1000)可选 easing:要使用的擦除效果的名称(需要插件支持).默认jQuery提供"linear" 和 "swing".可选 callback:回调函数.可选. 在这里就举例一个,对于easing 是需要插件支持的.目前没有实用就不做easing例子了. 例子: $("#foraspc").animate( {height:"50px",width:"100px",opacity:"0.8"}, 1000, function(){alert("执行完毕")} ); 试试看效果. (2).stop([clearQueue], [gotoEnd])停止所有在指定元素上正在运行的动画 $("#foraspcn").bind("click",function(){$("#www").stop();}); 当点击第二个div时,第一个层停止动作 (3).delay(duration, [queueName]);设置一个延时来推迟执行队列中之后的项目duration延时时间,单位:毫秒queueName队列名词,默认是Fx,动画队列。 举例:$("#foraspcn").slideUp(300).delay(800).fadeIn(400); 看看效果把. 5.jquery动画设置 BooleanjQuery.fx.off关闭页面上所有的动画 jquery简单的特效就讲完了. |
随便看 |
|
在线学习网考试资料包含高考、自考、专升本考试、人事考试、公务员考试、大学生村官考试、特岗教师招聘考试、事业单位招聘考试、企业人才招聘、银行招聘、教师招聘、农村信用社招聘、各类资格证书考试等各类考试资料。