IE6下position fixed失效的解决方法(亲测有效)
2014-08-19 10:25
405 查看
在网上找了好久,终于找到一种亲测有效的解决方法。
调用方法如下:
fixed一般应用有两种情况。
一,居中的弹层:
二,靠右的弹层,类似于回到顶部等:
这下就妥妥的了。
<!--[if IE 6]> <script type="text/javascript"> (function($) { jQuery.fn.Fixed = function(options) { var defaults = { x:0, y:0 }; var o = jQuery.extend(defaults, options); var isIe6 = !window.XMLHttpRequest; var html= $('html'); if (isIe6 && html.css('backgroundAttachment') !== 'fixed') { //防止抖动 html.css('backgroundAttachment','fixed') .css('backgroundImage','url(about:blank)'); }; return this.each(function() { var domThis=$(this)[0]; var objThis=$(this); if(isIe6){ objThis.css('position' , 'absolute'); domThis.style.setExpression('left', 'eval((document.documentElement).scrollLeft + ' + o.x + ') + "px"'); domThis.style.setExpression('top', 'eval((document.documentElement).scrollTop + ' + o.y + ') + "px"'); } else { objThis.css('position' , 'fixed').css('top',o.y).css('left',o.x); } }); }; })(jQuery) </script> <![endif]-->
调用方法如下:
<!--[if IE 6]> <script type="text/javascript"> $(function(){ $('.float').Fixed({x:800,y:200}); }); </script> <![endif]-->
fixed一般应用有两种情况。
一,居中的弹层:
<!--[if IE 6]> <script type="text/javascript"> $(function(){ //centerX和centerY是可视窗口的高和宽,需要减去自身的的宽度或高度的一半才能居中 var screenHeight=document.documentElement.clientHeight, screenWidth=document.documentElement.clientWidth, floatHeight=$('.float').height(), floatWidth=$('.float').width(); $('.float').Fixed({ x:(screenWidth-floatWidth)/2, y:(screenHeight-floatHeight)/2 }); }); </script> <![endif]-->
二,靠右的弹层,类似于回到顶部等:
<!--[if IE 6]> <script type="text/javascript"> $(function(){ //centerX和centerY是可视窗口的高和宽,高度自定义,宽度为屏幕宽度-浮层宽度 var screenHeight=document.documentElement.clientHeight, screenWidth=document.documentElement.clientWidth, floatHeight=$('.float').height(), floatWidth=$('.float').width(); $('.float').Fixed({ x:screenWidth-floatWidth, y:300 }); }); </script> <![endif]-->
这下就妥妥的了。
相关文章推荐
- 解决IE6下position:fixed失效的方法
- IE6不支持position:fixed的解决方法
- IE6不支持position:fixed的解决方法
- 真正完美解决IE6下position:fixed问题的方法{使用expression()没有抖动}
- 解决IE6不支持position:fixed的方法,非常简单
- IE6支持position:fixed完美解决方法
- IE6不支持position:fixed的解决方法
- csshack 解决ie6下position:fixed失效的问题
- 【css】css 解决 ie6 下 position:fixed 失效
- js,css三种方法解决IE6下position:fixed的Bug以及闪动问题
- IE6不支持position:fixed的解决方法
- ie6不兼容position:fixed的解决方法
- IE6不支持position:fixed的解决方法
- IE6支持position:fixed完美解决方法
- 完美解决IE6不支持position:fixed的bug
- IE6不支持position:fixed bug的完美解决
- position:fixed支持ie6的另类方法
- IE6中a标签location.href失效解决方法
- IE6不兼容position:fixed的解决办法(CSS里写js)