• 如果您觉得本站非常有看点,那么赶紧使用Ctrl+D 收藏吧

jQuery中toggle与slideToggle以及fadeToggle的显示、隐藏方法的比较

开发技术 开发技术 2周前 (01-11) 8次浏览

1、区别

①动画效果的比较:

toggle:直接显示、隐藏,如果有【时间参数】且【匹配的元素有宽度属性】,则动态效果为左上角-右下角拉卷效果,透明度0-1之间的变化;若有时间参数但是【匹配的元素没有宽度属性】,则动态效果为上下拉卷的效果,且没有透明度的变化。

slideToggle:切换上下拉卷滚效果,竖向变换。

fadeToggle:切换效果为淡入、淡出,只与透明度相关。

②判断方式的比较:

toggle:判断方式为匹配元素的display属性

slideToggle:判断方式为匹配元素的height属性

fadeToggle:判断方式为匹配元素的opacity属性

2、共性

①三个方法动画结束后若匹配元素隐藏,则display值都会变成”none“,不再影响页面的布局

②若同时有多个匹配元素,则这些元素不会作为一个整体实现动画,而是异步完成动画效果(同时完成)

 

个人学习动画效果的一些心得,如有错误或见解不到之处还望指正!


喜欢 (0)