Chrome不兼容position:fixed;的解决方案

今天在做一个回到顶部的浮动层时发现在IE7+和Firefox下均表现正常，但是在Chrome下却看不到浮动层。

在Chrome下却看不到Top这个图标，原来的css定义如下：

 代码如下 复制代码
{ width: 48px; height: 82px; position: fixed; right: 50px; bottom: 15px; background:url(../images/backtotop.png); cursor: pointer;}

只需要把原来的right:50px;改成right:10%;就能在Chrome下正常显示了

 

时间： 2024-09-23 23:04:01

Chrome不兼容position:fixed;的解决方案的相关文章

IE6不兼容position:fixed属性的解决办法

文章简介:IE6下不兼容position:fixed属性!在网上也看了一些资料还是不行! IE6下不兼容position:fixed属性!在网上也看了一些资料还是不行! position: fixed;这个属性用起来确实很方便,可以轻松的实现固定位置的浮动层效果.但是,它不支持IE6及以下版本.于是很多同学使用JS模拟.今天写了一个DEMO,涉及左侧.右侧.及上下两边,共四种位置的固定,与以往的教程不同的地方是,它使用CSS表达式来兼容IE5.IE6,且避免了js模拟时,拖动滚动条时出现抖动的问

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

  关于IE6,虽然它已被微软抛弃很久了,但是由于大天朝的特殊行情(盗版)对于前端工程师来说,解决IE6兼容position:fixed的问题显得很重要.特别是你需要用到头尾悬停调用的时候 先来看段代码 ? 1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 <!DOCTYPE html> <html> <head> <meta http-equiv="Content-Typ

css IE6 position:fixed (固定定位)通过position：absolute的解决方案

css教程 ie6 position:fixed (固定定位)通过position:absolute的解决方案,完全使用position:absolute来解决固定定位问题.因为其他的浏览器都支持绝对定位,在ie6,7,8,9,ff,chrome中均测试通过.注意一点:不能给外包含的元素mod-test设置高度,不然的话,是没有滚动条的.而应该在里面设置一个容器,它设置一个高度  <!doctype html public "-//w3c//dtd xhtml 1.0 transition

ie6,ie7,ie8完美支持position:fixed的终极解决方案_经验交流

ie6对position:fixed不支持,网上有很多解决方法,有的在ie6,ie7上调试成功后,在ie8上又不好使,div层还是跟随滚动条浮 动:以下总结方法,在ie6,ie7,ie8上都调试成功,且页面滚动条滚动时,效果还挺好,div层并不会闪烁. 复制代码 代码如下: <div id="goTop_div" class="fixed ie">  </div> css: 复制代码 代码如下: .fixed{         positio

css解决IE6、Chrome、ff 浏览器position:fixed;和闪动问题

 代码如下 复制代码 html{ _background:url(about:blank); /* 阻止闪动 in IE6 , 把空文件换成about:blank , 减少请求 */ } /* 你的图层 */ .positionFixedLayer{ position:fixed; _position: absolute; _top:expression(documentElement.scrollTop+documentElement.clientHeight-this.offsetHeigh

不受控制的 position:fixed

大家都知道,position:fixed 在日常的页面布局中非常常用,在许多布局中起到了关键的作用.它的作用是: position:fixed 的元素将相对于屏幕视口(viewport)的位置来指定其位置.并且元素的位置在屏幕滚动时不会改变. 但是,在许多特定的场合,指定了 position:fixed 的元素却无法相对于屏幕视口进行定位.这是为何呢?   失效的 position:fixed 在许多情况下,position:fixed 将会失效.MDN 用一句话概括了这种情况: 当元素祖先的

CSS{position:fixed}让HTML固定在浏览器的某个位置

文章简介:跨浏览器的CSS固定定位{position:fixed}. 不知道您是否留意了,浏览本站时,浏览器右下角有一个标着top的黑色直角三角形,可以点击它返回到正在浏览的网页页眉.当滚动网页时,它的位置一直没有任何改变,您感觉它怎么样?这就是通过CSS的定位属性{position:fixed}来实现的,通过它可以让HTML元素脱离文档流固定在浏览器的某个位置. IE7.Firefox.Opera,都支持CSS的{position:fixed},所以很容易实现(<详解定位与定位应用>) IE

【原】使用iScroll.js解决ios4下不支持position:fixed的问题

一直折腾position:fixed在ios和android的使用,而事实上这么上流的ios4系统居然不支持position:fixed,幸运的是苹果公司在ios5系统修复了这个bug,比较理想的解决方案是让所有用户把系统升级到ios5及以上版本,这种想法在国外还好,在国内环境下,因为越狱而不想去升级手机的人很多,如果强迫用户去升级,那可能会把你的产品KS了.而你也不可能跟你老板说ios4什么不兼容那个属性啊,让用户升级啊!老板看到的是结果,你做不出来,别人怎么做得出来呢,这样你老板可能会对你的

css ie6 position:fixed无效的解决方法

我用到了css教程的一个属性position:fixed,但遗憾的是在IE6下这个属性不起作用,悲剧的IE6,于是便找解决方案,现把最佳的解决方案拿出来与大家分享,或许不久的将来你能用上. 1.要实现的效果如下图: 这时弹出提示在浏览器最右上角可见区   这时浏览器向下滚动了一下,但要让弹出层保持在浏览器最右上角可见区   2.兼容的解决方案代码如下:   .loading_tip {  position: fixed; _position: absolute; top: 10px;  righ