`
scriptlover
  • 浏览: 10601 次
  • 性别: Icon_minigender_1
  • 来自: 北京
社区版块
存档分类
最新评论

修复ie6-position:fixed

阅读更多

在web开发中,经常需要将元素固定在某个位置,不随浏览器的拖动而改变。
 这时候,你可能很快会想到使用position:fixed;方式去处理,不错这个方案是标准的,并且在ie6+,ff等浏览器中都能很好的渲染,但ie6却不支持此属性。

 因ie6在目前的用户量仍然很大,我们必须将其考虑在内。
 其实早些时候在网上已经涌现了一些解决方案,但归结如下:
 1.监听滚动条的拖动,动态改变元素的位置。
 2.利用ie所支持css中的expression,在里面写script去动态获取位置。

 但是上面的两种方法都会造成元素的刷新,虽然第二种会好些,但仍然不是我们要的效果,在这里以上两种实现方法,不做细节讨论,主要给大家介绍一种方法:
 1.如果是非ie6,那么利用position:fixed;方式。
 2.如果是ie,通过将body元素高定位100%,并做一些处理。

 下面是代码演示和下载:
http://www.scriptlover.com/controls/FixedPosition

from:http://www.scriptlover.com/

分享到:
评论

相关推荐

    微信小程序----position:sticky

    微信小程序----position:sticky:通过position:fixed与position:relative切换。

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

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

    javascript ie6兼容position:fixed实现思路

    positon:fixed 让HTML元素脱离文档流固定在浏览器的某个位置 网页中经常会有...} ie6下positon:fixed不起作用,只能靠js来实现了,首先在ie6下需要将position设置为absolute 代码如下: position:fixed;bottom:60px;_po

    IE7下当position:fixed遇到text-align:center的解决方法

    IE7下当position:fixed遇到text-align:center 的一些状况,大家可以参考下。

    position:fixed;实现底层页面不跟随浮层模块滚动

    position:fixed;实现底层页面不跟随浮层模块滚动

    IE6支持position:fixed完美解决方法

    IE7已经支持position:fixed了,而我们的IE6呢?还继续使用js事件?消耗资源,破坏结构,画面闪耀。

    仿MAC官网导航菜单样式源文件

    #nav .n01 a:visited { background-position:0 -114px; } #nav .n01 a:hover { background-position:0 -38px; } #nav .n01 a:active { background-position:0 -76px; } #nav .n02 a:link { background-position:-...

    css background-position 用法详细图文介绍

    语法:background-position : length || length background-position : position || position 取值:length : 百分数 | 由浮点数字和单位标识符组成的长度值。请参阅 长度单位 position : top | center | ...

    IE6中的position:fixed定位兼容性写法分享

    background-attachment:fixed;}/* IE6 头部固定 */html .fixed-top{position:absolute;bottom:auto;top:[removed]eval(document.documentElement.scrollTop));}/* IE6 右侧固定 */html .fixed-r

    position:fixed在ie6的使用

    position:fixed在ie6的使用,hack的使用办法

    三星9305收索

    border-bottom:1px solid #e6e6e6}.bdsug-ala h3{line-height:14px;background:url(//www.baidu.com/img/sug_bd.png) no-repeat left center;margin:6px 0 4px 0;font-size:12px;font-weight:normal;color:#7b7b7b;...

    JS 滚动事件[removed]与position:fixed写兼容IE6的回到顶部组件

    IE6的兼容性问题主要出现在position:fixed上面,如何解决已经在《【CSS】IE6中的position:fixed问题与随滚动条滚动的效果》(点击打开链接)介绍过了。 下面具体说说如何利用JavaScript中的滚动事件[removed]实现...

    TMS.Component.Pack.6.8.2.0

    - New : Extra parameter added for grid.ScrollInView to define scroll position better - Improved : Handling of VCL styles - Fixed : Issue with Combobox inplace editor & grid OnKeyDown event - Fixed : ...

    CSS在图片中的应用

    background-position:-22px -5px; } #face li#face2 { background-position:-104px -5px; } #face li#face3 { background-position:-185px -5px; } #face li#face4 { background-position:-265px -5px; }...

    ie6 position:fixed解决方案

    可是要在IE6中实现固定效果,position: fixed;就不奏效了。 目前我所知的ie6下fixed的方案大概有纯css和expression+js两种,各有利弊。 1.纯css法 利用了ie6下html元素外面套的一个匿名元素,即 * ,利用选择器层级...

    div-css-漂亮的导航条

    /* Commented Backslash Hack hides rule from IE5-Mac \*/ #tabs1 a span {float:none;} /* End IE5-Mac hack */ #tabs a:hover span { color:#627EB7; } #tabs1 a:hover { background-position:0% -42px; ...

    css中position:fixed实现div居中上下左右居中

    实现div居中的方法多如牛毛,本例为大家介绍的这个方法是使用css中position:fixed来实现div上下左右居中,这个小技巧比较使用,大家看看

    jquery超炫照片墙

    " data-transform="rotate(-6deg)"><img alt="" src="images/thumbs/20.jpg" style="width: 115px; height: 115px; margin-top: 5px; margin-left: 5px;"> <div style="background-position: -250px -375px; left...

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

    NULL 博文链接:https://piziwang.iteye.com/blog/424862

    跨浏览器的实践:position:fixed 层的固定定位

    一般要固定某个div,我们都会让该div{position:fixed},它的下一个div{position:absolute}看了几个国外的关于CSS的固定定位跨浏览解决方案.他们却反其道而为之

Global site tag (gtag.js) - Google Analytics