純CSS定位の固定浮動層コード不閃互換IE 6 8火狐Googleなど
/* IE8 */
.fixed-bottom
{
position: fixed; bottom: 0px; width: 1100px; left: 50%; margin-left: -550px;
}
/* IE6 */
* html,* html body /* IE6 bug */
{
background-image:url(about:blank); /* */
background-attachment:fixed; /* prevent screen flash in IE6 , */
}
* 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));
}
ページコード:
<div id="divFixed" class="fixed-bottom">
<img src="images/nhzt/nhzt_bb2.jpg" alt="" border="0" />
</div>
中央固定スタイル:
/* IE8 */
.fixed-middle {
position: fixed; left:50%; top: 50%; margin-top: -80px;margin-left:-155px;
}
/* IE6 */
* html,* html body /* IE6 bug */
{
background-image:url(about:blank); /* */
background-attachment:fixed; /* prevent screen flash in IE6 , */
}
* html .fixed-middle /* IE6 */
{
position:absolute;
bottom:auto;top:expression(eval(document.documentElement.scrollTop) + document.documentElement.clientHeight/2 - this.offsetHeight/2);
margin-top:0px;
}