当前位置： 代码迷 >> HTML/CSS >> 纯CSS定位的固定浮动层代码 不闪 兼容IE6 八 火狐 谷歌等
  详细解决方案

纯CSS定位的固定浮动层代码 不闪 兼容IE6 八 火狐 谷歌等

热度：535   发布时间：2013-12-11 16:44:13.0
纯CSS定位的固定浮动层代码 不闪 兼容IE6 8 火狐 谷歌等
  1. /*??IE8?火狐??谷歌等?固定样式??*/??
  2. .fixed-bottom??
  3. {??
  4. ????position:?fixed;?bottom:?0px;?width:?1100px;?left:?50%;??margin-left:?-550px;??
  5. }??
  6. ??
  7. /*??IE6?固定样式?*/??
  8. *?html,*?html?body?/*?修正IE6振动bug?*/??
  9. {??
  10. ????background-image:url(about:blank);????/*用浏览器空白页面作为背景*/??
  11. ????background-attachment:fixed;?/*?prevent?screen?flash?in?IE6?确保滚动条滚动时，元素不闪动*/??
  12. }??
  13. *?html?.fixed-top?/*?IE6?头部固定?*/??
  14. {??
  15. ????position:absolute;bottom:auto;top:expression(eval(document.documentElement.scrollTop));??
  16. }??
  17. *?html?.fixed-right?/*?IE6?右侧固定?*/???
  18. {??
  19. ????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));??
  20. }??
  21. *?html?.fixed-bottom?/*?IE6?底部固定?*/??
  22. {??
  23. ????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)));??
  24. }??
  25. *?html?.fixed-left?/*?IE6?左侧固定?*/??
  26. {??
  27. ????position:absolute;right:auto;left:expression(eval(document.documentElement.scrollLeft));??
  28. }??
  1. /*??IE8?火狐??谷歌等?固定样式??*/??
  2. ????????.fixed-middle????????{??
  3. ????????????position:?fixed;?left:50%;?top:?50%;??margin-top:?-80px;margin-left:-155px;??
  4. ????????}??
  5. ??
  6. ????????/*??IE6?固定样式?*/??
  7. ????????*?html,*?html?body?/*?修正IE6振动bug?*/??
  8. ????????{??
  9. ????????????background-image:url(about:blank);????/*用浏览器空白页面作为背景*/??
  10. ????????????background-attachment:fixed;?/*?prevent?screen?flash?in?IE6?确保滚动条滚动时，元素不闪动*/??
  11. ????????}??
  12. ????????*?html?.fixed-middle?/*?IE6?居中固定?*/??
  13. ????????{??
  14. ????????????position:absolute;??
  15. ????????????bottom:auto;top:expression(eval(document.documentElement.scrollTop)?+?document.documentElement.clientHeight/2?-?this.offsetHeight/2);??
  16. ????????????margin-top:0px;??
  17. ????????} ?
  相关解决方案

代码迷 - 您身边的软件异常，代码异常，编程异常助手（发现，解决，分享）
Copyright © 2009-2013 DAIMAMI.COM. All rights reserved.