jquery的slideUp、slideDown在IE中的闪动bug-完美解决
2017-03-29 10:34
501 查看
最近用到了jquery的一个收缩特效,但是发现有个bug,就是slideUp的时候隐藏完毕会闪动一下,这个在IE下是有问题的,谷歌火狐没问题,这个网上搜索了很多资料,很多都说没有增加html 的w3c说明之类的,其实加上也是白搭的
这个特效产生闪动的bug原因是:由于容器使用了position的relative或者absolute导致,当然我们不用这个属性在布局的时候就会遇到很大麻烦,所以我自己研究了一种解决方案,即使用了position,又能解决闪动,研究jquery源码结果显示slideUp这个函数内部调用的是animate这个动画函数,所以,我们不直接调用slideUp这个特效,改成调用animate这个函数,当然直接改成调用animate也是有闪动现象,下面是最关键的一步:animate调用的时候增加一个透明的设置,例如:ulObj.animate({height: 'toggle', opacity: 'toggle'}, speed);其中opacity: 'toggle'就是设置透明渐变,这样等图形收起之后就变为完全透明,回闪那一下是透明的,所以就看不到了,我自己试过,非常完美,希望给大家带来帮助
这个特效产生闪动的bug原因是:由于容器使用了position的relative或者absolute导致,当然我们不用这个属性在布局的时候就会遇到很大麻烦,所以我自己研究了一种解决方案,即使用了position,又能解决闪动,研究jquery源码结果显示slideUp这个函数内部调用的是animate这个动画函数,所以,我们不直接调用slideUp这个特效,改成调用animate这个函数,当然直接改成调用animate也是有闪动现象,下面是最关键的一步:animate调用的时候增加一个透明的设置,例如:ulObj.animate({height: 'toggle', opacity: 'toggle'}, speed);其中opacity: 'toggle'就是设置透明渐变,这样等图形收起之后就变为完全透明,回闪那一下是透明的,所以就看不到了,我自己试过,非常完美,希望给大家带来帮助
相关文章推荐
- jquery的slideUp、slideDown函数在IE中bug解决办法
- jquery的slideUp、slideDown函数在IE中的bug
- jquery的slideUp、slideDown函数在IE中的bug
- jquery的slideUp、slideDown函数在IE中的bug
- 完美解决jQuery的hover事件在IE中不停闪动的问题
- 解决jquery slideUp 方法闪动的问题
- IE8中Jquery slideUp、slideDown方法由Position属性引起的Bug
- jquery的slideUp、slideDown、slideToggle等涉及滑动效果的一系列函数,在IE浏览器下有几处bug
- jquery slideup 闪动解决方法(转)
- jQuery中的slideUp()、slideDown()、hide()、show()
- 【jQuery】使用slideUp()和slideDown()方法的滑动效果
- Slidetoggle + JQuery + IE 7 = Bug!
- jQuery中的slideUp()、slideDown()、hide()、show() 的比较
- 解决JQUERY在IE下将字符串转成XML对象时产生的BUG
- jQuery入门学习之实现滑动效果:slideUp()和slideDown()小总结
- [举一反三]解决IE下select标签innerHTML插入option的BUG(兼容IE,FF,Opera,Chrome,Safari) 前言: 这是一个老bug了,现在提供一个完美解决方案。由于我一直是用createElement来创建动态的op
- 解决JQUERY在IE下将字符串转成XML对象时产生的BUG
- jquery的hide(),show(),fastIn(),fastOut(),slideUp(),slideDown()的使用
- jquery 连写注释;siblings() 方法;jQuery 的3种滑动方法;slideUp()向上滑动;slideDown()向下滑动;slideToggle()来回滑动
- 完美解决IE6下position:fixed的Bug;以及闪动问题