WEB教程基地:www.91ctc.com为你搭建学习WEB技术的优秀平台
在线留言 网站地图 加入收藏 设为首页
您的位置:本站首页>>网页设计制作技巧>>解决IE6不支持position:fixed的bug

解决IE6不支持position:fixed的bug

[ 录入者:91ctc | 时间:2012-06-09 09:47:25 | 作者: 91ctc| 来源:本站原创 | 浏览: 次 ]


去年做了一个前端效果,让一个网页的右下角出现一个视频,但是视频要绝对定位于右下角(即使滚动垂直滚动条),当时用到了position:fixed这个定位属性,但是后来发现垃圾的IE6不认识这个属性!当时真是焦急万分。无奈之下和技术经理讨论,他提示说CSS样式有问题,让我整一个HACK写法让其兼容IE6。后来经过一番研究摸索,终于解决了这个问题,现在分享出来,同时我把之前的例子也给上传上来:

核心CSS代码(HACK写法):

CSS Code复制内容到剪贴板
  1. /* 除IE6浏览器的通用方法 */    
  2. .divCss{position:fixed;PADDING-BOTTOM: 0px; PADDING-LEFT: 0px; BOTTOM: 0px; PADDING-RIGHT: 0px; DISPLAY: block; HEIGHT: 225px; OVERFLOW: hidden; RIGHT: 20px; PADDING-TOP: 0px;}     
  3.   
  4. /* IE6浏览器的特有方法 */    
  5. /* 修正IE6振动bug */    
  6. * html,* html body{background-image:url(about:blank);background-attachment:fixed}     
  7. * html .divCss{position:absolute;left:expression(eval(document.documentElement.scrollLeft));top:expression(eval(document.documentElement.scrollTop))}     
  8. * html .divCss{position:absolute;left:expression(eval(document.documentElement.scrollLeft+document.documentElement.clientWidth-this.offsetWidth)-(parseInt(this.currentStyle.marginLeft,10)||0)-(parseInt(this.currentStyle.marginRight,10)||0));top:expression(eval(document.documentElement.scrollTop+document.documentElement.clientHeight-this.offsetHeight-(parseInt(this.currentStyle.marginTop,10)||0)-(parseInt(this.currentStyle.marginBottom,10)||0)))}   

具体效果,请看demo吧,demo下载地址:完美解决IE6不支持position fixed的bug例子


关闭】【返回顶部

相关文章
{xiangguan_list}
91ctc.com 网络先锋,引领科技,本站原创作品[转载请注明出处]。联系我们
Copyright© 2010-2017 计算机教程中心网 . All rights reserved. 苏ICP备11081842号