[技巧心得] 浮动固定于顶部,固定于中部,固定于底部css代码

解决IE6中闪动问题

*{background-image:url(about:blank);background-attachment:fixed;}
body{
	background-image:url(about:blank);background-attachment:fixed;
	background-color: #e3d8c6;
}
或下方

html{ /*这个可以让IE6下滚动时无抖动*/background: url(about:black) no-repeat fixed}

浮动固定于顶部

  1. .doc-hd-outer{background:#000;height:40px;position:fixed;_position:absolute;top:0;left:0;width:100%;z-index:100;
  2. _top:expression(eval(document.compatMode&&document.compatMode=='CSS1Compat')?documentElement.scrollTop:document.body.scrollTop);
  3. }
复制代码

固定于中部


  1. .doc-hd-outer{position:fixed;top:50%;margin-top:-20px;_margin-top:0;_position:absolute;_top:expression(eval(document.compatMode&&document.compatMode=='CSS1Compat')?documentElement.scrollTop + (document.documentElement.clientHeight-this.offsetHeight)/2:document.body.scrollTop +(document.body.clientHeight - this.clientHeight)/2);display:block;width:100%;left:0;background:#000;height:40px;z-index:999}
复制代码

固定于底部


  1. .doc-hd-outer{position:fixed;bottom:0;_position:absolute;_top:expression(eval(document.compatMode&&document.compatMode=='CSS1Compat')?documentElement.scrollTop + (document.documentElement.clientHeight-this.offsetHeight):document.body.scrollTop +(document.body.clientHeight - this.clientHeight));display:block;width:100%;left:0;background:#000;height:40px;z-index:999}
复制代码
 

底部固定

#boxA{
    position: fixed;
    z-index: 999;
    bottom: 0px;
    left: 0px;
    _position:absolute;
    _top:expression(documentElement.scrollTop + documentElement.clientHeight-this.offsetHeight);
    overflow:hidden; 
    *zoom:1;
}

 

右侧距底部30px固定

#boxB{
    position: fixed;
    z-index: 999;
    bottom: 30px;
    right: 0;
    _position:absolute;
    _top:expression(documentElement.scrollTop + documentElement.clientHeight-this.offsetHeight + 30);
    overflow:hidden; 
    *zoom:1;
}

右侧距顶部45px固定

#boxC{
    position: fixed;
    z-index: 999;
    top: 45px;
    right: 0;
    _position:absolute;
    _top:expression(documentElement.scrollTop + 45);
    overflow:hidden; 
    *zoom:1;
}




  left:75px;;
    top:10px;/*FF IE7*/
    z-index:9999;
    position:fixed!important;/*FF IE7*/
    position:absolute;/*IE6*/
    _top:       expression(eval(document.compatMode &&
    document.compatMode=='CSS1Compat') ?
    documentElement.scrollTop + (document.documentElement.clientHeight-this.offsetHeight)/2 :/*IE6*/
    document.body.scrollTop + (document.body.clientHeight - this.clientHeight)/2);/*IE5 IE5.5*/

posted on 2014-12-09 11:02  鬼鬼丫404  阅读(1215)  评论(0编辑  收藏  举报

导航