本文小编为大家详细介绍“jquery淡入的方法是什么”,内容详细,步骤清晰,细节处理妥当,希望这篇“jquery淡入的方法是什么”文章能帮助大家解决疑惑,下面跟着小编的思路慢慢深入,一起来学习新知识吧。
创新互联公司服务项目包括鹿寨网站建设、鹿寨网站制作、鹿寨网页制作以及鹿寨网络营销策划等。多年来,我们专注于互联网行业,利用自身积累的技术优势、行业经验、深度合作伙伴关系等,向广大中小型企业、政府机构等提供互联网行业的解决方案,鹿寨网站推广取得了明显的社会效益与经济效益。目前,我们服务的客户以成都为中心已经辐射到鹿寨省份的部分城市,未来相信会继续扩大服务区域并继续获得客户的支持与信任!
淡入有3种方法:1、fadeIn(),可以淡入隐藏元素,语法“元素对象.fadeIn(淡入时长)”;2、fadeTo(),语法“元素对象.fadeTo(时长,1)”;3、fadeToggle(),语法“对象.fadeToggle(时长)”。
本教程操作环境:windows7系统、jquery1.10.2版本、Dell G3电脑。
在jquery中,能实现淡入效果的有三个方法:
fadeIn() 方法
fadeToggle() 方法
fadeTo() 方法
1、fadeIn() 方法
fadeIn() 用于淡入已隐藏的元素。
语法:
$(selector).fadeIn(speed,callback);
可选的 speed 参数规定效果的时长。它可以取以下值:"slow"、"fast" 或毫秒。.
可选的 callback 参数是 fading 完成后所执行的函数名称。
示例:
以下实例演示了 fadeIn() 使用了不同参数的效果。
2、fadeTo() 方法
fadeTo() 方法允许渐变为给定的不透明度(值介于 0 与 1 之间)。
语法:
$(selector).fadeTo(speed,opacity,callback);
必需的 speed 参数规定效果的时长。它可以取以下值:"slow"、"fast" 或毫秒。
fadeTo() 方法中必需的 opacity 参数将淡入淡出效果设置为给定的不透明度(值介于 0 与 1 之间)。
可选的 callback 参数是该函数完成后所执行的函数名称。
只需要将opacityc参数的值设置为1,即可实现淡入效果。
$(document).ready(function() { $("button").click(function() { $("#div1").fadeTo("fast",1); $("#div2").fadeTo("slow",1); $("#div3").fadeTo(5000,1); }); });
3、fadeToggle() 方法
fadeToggle() 方法可以在 fadeIn() 与 fadeOut() 方法之间进行切换。
如果元素已隐藏,则 fadeToggle() 会向元素添加淡入效果。
如果元素已显示,则 fadeToggle() 会向元素添加淡出效果。
$(document).ready(function() { $("button").click(function() { $("#div1").fadeToggle(); $("#div2").fadeToggle("slow"); $("#div3").fadeToggle(5000); }); });
读到这里,这篇“jquery淡入的方法是什么”文章已经介绍完毕,想要掌握这篇文章的知识点还需要大家自己动手实践使用过才能领会,如果想了解更多相关内容的文章,欢迎关注创新互联行业资讯频道。