`
kk48323201
  • 浏览: 94017 次
  • 性别: Icon_minigender_1
  • 来自: 珠海
社区版块
存档分类
最新评论

完美解决IE6关于fixed的BUG,兼容IE7_IE8_IE9_FF

    博客分类:
  • CSS
阅读更多
<style>
.fixed-top /* 头部固定 */{position:fixed;bottom:auto;top:0px;}
.fixed-bottom /* 底部固定 */{position:fixed;bottom:0px;top:auto;}
.fixed-left /* 左侧固定 */{position:fixed;right:auto;left:0px;}
.fixed-right /* 右侧固定 */{position:fixed;right:0px;left:auto;}
/* 上面的是除了IE6的主流浏览器通用的方法 */
* html,* html body /* 修正IE6振动bug */{background-image:url(about:blank);background-attachment:fixed;}
* html .fixed-top /* IE6 头部固定 */{position:absolute;bottom:auto;top:expression(eval(document.documentElement.scrollTop));}
* html .fixed-right /* IE6 右侧固定 */ {position:absolute;right:auto;left:expression(eval(document.documentElement.scrollLeft+document.documentElement.clientWidth-this.offsetWidth)-(parseInt(this.currentStyle.marginLeft,10)||0)-(parseInt(this.currentStyle.marginRight,10)||0));}
* html .fixed-bottom /* IE6 底部固定  */{position:absolute;bottom:auto;top:expression(eval(document.documentElement.scrollTop+document.documentElement.clientHeight-this.offsetHeight-(parseInt(this.currentStyle.marginTop,10)||0)-(parseInt(this.currentStyle.marginBottom,10)||0)));}
* html .fixed-left /* IE6 左侧固定 */{position:absolute;right:auto;left:expression(eval(document.documentElement.scrollLeft));}
</style>


十分强悍的代码,要用fixed的时候直接给元素赋相应的类就可以
分享到:
评论

相关推荐

    CSS完美兼容IE6_IE7_FF的通用方法

    ### CSS完美兼容IE6_IE7_FF的通用方法 在网页设计与开发过程中,浏览器兼容性问题一直是前端开发者面临的重要挑战之一。特别是在早期的Web开发中,如何让网站能够良好地运行在不同版本的Internet Explorer(IE)...

    兼容IE6的fixed定位不晃动

    纯css兼容IE6的fixed定位不上下晃动!

    IE6不支持fixed解决方法

    这种方法虽然能解决IE6的`fixed`定位问题,但请注意,它并不是一个完美的解决方案。`expression`在某些情况下可能会影响性能,尤其是在大量或复杂的页面中。此外,这种方法也仅适用于IE6,对于其他版本的IE或其他...

    HTML IE6 纯CSS 解决 position fixed 的问题

    为了解决IE6中的`position: fixed;`问题,我们可以采用以下几种方法: 1. **条件注释法**: 在HTML文档的头部,可以使用IE6特有的条件注释来引入一个专门为IE6定制的CSS文件,这样可以针对IE6浏览器提供特别的样式...

    IE6下fixed实现头部定位

    本资源旨在解决IE6下`fixed`定位的实现问题,帮助开发者绕过这个棘手的兼容性障碍。要理解这个问题,首先要了解`position: fixed`的正常行为:元素的位置基于视口,而不是文档流,这意味着它会保持在屏幕的特定位置...

    IE6特有bug兼容性问题整理

    ### IE6特有bug兼容性问题整理 #### 1. 浮动(float)与相邻非浮动元素的表现差异 - **问题描述**: 在不同浏览器中,对于`float`元素和相邻非`float`元素的处理方式存在差异。具体表现为,在IE6中,当一个元素设置...

    完美解决png在ie6兼容问题完整示例

    PNG图像格式在Internet Explorer 6 (IE6)中存在兼容性问题,主要表现为半透明(Alpha)PNG图像显示不正常,出现灰色背景或边框,这严重影响了网页设计的美观和用户体验。为了解决这个问题,开发者通常会利用...

    CSS兼容IE6,IE7,FF的技巧

    ### CSS兼容IE6, IE7, FF的技巧详解 #### 一、CSS Hack技术解析 在Web开发过程中,由于不同的浏览器对CSS的支持程度不同,尤其是IE6与IE7这类较老版本的浏览器,在处理CSS样式时存在差异。为了确保网站在不同...

    IE6实现position:fixed bug (固定窗口方法)的实例

    这个内容是老生常谈了,主要问题就是IE6不支持 position:fixed 引起的BUG.当我们去搜索解决这个bug的垮浏览器解决办法时,绝大多数结果都是说使用 position:absolute 来替代解决,可是我们真的解决了么?没有,因为当页面...

    IE6 fixed 不抖动

    一般的IE6 fixed都会抖动,很难看,童叟无欺,绝对不抖动

    兼容IE6的Fixed定位示例

    兼容IE6的Fixed定位示例,通过Exp和JS判断浏览器,然后选择是否降级

    ie6下定位bug解决

    在其他现代浏览器中,CSS的`position`属性如`relative`、`absolute`和`fixed`能很好地实现元素的定位,但在IE6中,这些属性的处理方式却大不相同,导致开发者需要进行特殊的“hack”来解决这些问题。 首先,IE6不...

    IE6下的纯CSS完美position:fixed实现

    这篇博客“IE6下的纯CSS完美position:fixed实现”可能介绍了一种通过CSS技巧或JavaScript工作来模拟`position: fixed`的方法。 尽管描述为空,我们可以推测博主可能探讨了以下几种常见策略: 1. **表达式...

    IE6 -- IE8浏览器CSS兼容性查询手册【gif格式】

    这份“IE6 -- IE8浏览器CSS兼容性查询手册”就是为了解决这样的问题而生。 CSS是网页设计中用于控制布局和样式的语言,它使得我们可以将内容和表现分离,提高网页的可维护性和可访问性。但遗憾的是,IE6、IE7和IE8...

    js完美解决IE6不支持position:fixed的bug

    总的来说,解决IE6不支持`position:fixed`的bug需要开发者具备深厚的前端知识,包括CSS兼容性、CSS Hack以及对JavaScript表达式的理解。同时,也需要权衡性能与兼容性的关系,适时地做出技术决策,以适应不断变化的...

    ie6/7/8的 css hack

    【CSS Hack】在Web开发中,CSS Hack是一种特殊的技术,用于解决不同浏览器对CSS解析的差异,特别是针对老版本的Internet Explorer(IE6、IE7和IE8)的兼容性问题。这些浏览器在解析CSS时存在诸多不一致,导致设计师...

    超简单在IE6中实现Fixed效果并无抖动的返回顶部

    在IE6浏览器中,由于其自身的局限性,`fixed`定位常常会出现问题,尤其是在滚动时元素抖动或者无法正常固定位置。这个问题对于现代浏览器来说已经不是问题,但在过去,特别是对于那些还需要支持IE6的网站,这是一个...

    IEtest 5-8 css样式兼容

    例如,IE6、7、8对于盒模型、浮动、定位、渐变、阴影等CSS特性支持不足或者实现方式与其他现代浏览器有差异,导致页面在这些版本的IE中显示不一致。 IEtest软件的出现,使得开发者能够快速地在多种IE版本下预览和...

Global site tag (gtag.js) - Google Analytics