经典论坛's Archiver

ydxiao 发表于 2008-8-28 20:23

求助,关于层的定位问题.IE7可以,但IE6不兼容

以下主要是那段JS代码,所加的图片是用来加载的时候时间停留多点,以看清效果.


以下JS代码在IE7中可以居中显示,还能随着滚动条滚动而滚动,但在IE6中却只固定在上部,具体大家可以分别在IE7跟IE6中对比效果.请问要怎么改,才能让IE6中看到的效果跟IE7中的一样?


后面要运行的代码主要是这段JS代码:
[code]<script type="text/javascript">
document.write('<div id="_pl_loading" onmouseover="this.style.display=\'none\'"></div>');
_pl_div = document.getElementById('_pl_loading');
_pl_div.style.position = 'fixed';
_pl_div.style.width = '400px';
_pl_div.style.height = '200px';
_pl_div.style.zIndex = 65000;

_pl_clientWidth = document.documentElement.clientWidth ? document.documentElement.clientWidth : document.body.clientWidth;
_pl_clientHeight = document.documentElement.clientHeight ? document.documentElement.clientHeight : document.body.clientHeight;

_pl_div.style.left = ((_pl_clientWidth - 400) / 2) + 'px';
_pl_div.style.top = ((_pl_clientHeight - 200) / 2) + 'px';

_pl_div.className = 'box';
_pl_div.innerHTML = '<h4>温&nbsp;馨&nbsp;提&nbsp;示</h4><img src=\'banner/3zl.jpg\' border=\'0\' align=\'absmiddle\' /><br /><img src=\'images/default/loading.gif\' border=\'0\' align=\'absmiddle\' />&nbsp;正在为您载入页面，请稍候……';

document.body.appendChild(_pl_div)

_pl_alpha('_pl_loading', 70);

function _pl_onload() {
        document.getElementById('_pl_loading').style.display='none';
}

if (document.attachEvent) window.attachEvent('onload',_pl_onload);
else window.addEventListener('load',_pl_onload,false);

function _pl_alpha(obj,al) {
        if(typeof obj != 'object') obj = document.getElementById(obj);
        if(!obj) return;
        var alpha=al/100;
        obj.style.filter = "alpha(opacity:"+al+")";
        obj.style.KHTMLOpacity = alpha;
        obj.style.MozOpacity = alpha;
        obj.style.opacity = alpha;
}
</script>[/code]



[html]<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=gb2312" />
<title>无标题文档</title>
</head>

<body>

<script type="text/javascript">
document.write('<div id="_pl_loading" onmouseover="this.style.display=\'none\'"></div>');
_pl_div = document.getElementById('_pl_loading');
_pl_div.style.position = 'fixed';
_pl_div.style.width = '400px';
_pl_div.style.height = '200px';
_pl_div.style.zIndex = 65000;

_pl_clientWidth = document.documentElement.clientWidth ? document.documentElement.clientWidth : document.body.clientWidth;
_pl_clientHeight = document.documentElement.clientHeight ? document.documentElement.clientHeight : document.body.clientHeight;

_pl_div.style.left = ((_pl_clientWidth - 400) / 2) + 'px';
_pl_div.style.top = ((_pl_clientHeight - 200) / 2) + 'px';

_pl_div.className = 'box';
_pl_div.innerHTML = '<h4>温&nbsp;馨&nbsp;提&nbsp;示</h4><img src=\'banner/3zl.jpg\' border=\'0\' align=\'absmiddle\' /><br /><img src=\'images/default/loading.gif\' border=\'0\' align=\'absmiddle\' />&nbsp;正在为您载入页面，请稍候……';

document.body.appendChild(_pl_div)

_pl_alpha('_pl_loading', 70);

function _pl_onload() {
        document.getElementById('_pl_loading').style.display='none';
}

if (document.attachEvent) window.attachEvent('onload',_pl_onload);
else window.addEventListener('load',_pl_onload,false);

function _pl_alpha(obj,al) {
        if(typeof obj != 'object') obj = document.getElementById(obj);
        if(!obj) return;
        var alpha=al/100;
        obj.style.filter = "alpha(opacity:"+al+")";
        obj.style.KHTMLOpacity = alpha;
        obj.style.MozOpacity = alpha;
        obj.style.opacity = alpha;
}
</script>

<table width="500" height="500" border="0" align="center" bgcolor="#00FF00">
  <tr>
    <td>&nbsp;</td>
  </tr>
</table>

<img src="http://bbs.e763.com/attachmentse763/month_0808/20080825_dde00f762cce45c9f747AZov9e7v7PXN.jpg" width="600" height="800" />
<img src="http://bbs.e763.com/attachmentse763/month_0808/20080824_4a506ce05089fab3dd10Nx7eGTpz0bAw.jpg" width="700" height="526" />
<img src="http://bbs.e763.com/attachmentse763/month_0808/20080824_9d975a3392994203c2damT8gjMWnqiiG.jpg" width="700" height="526" />
<img src="http://bbs.e763.com/attachmentse763/month_0808/20080824_7072cdc925c41050f205t711eo0QDDaO.jpg" width="700" height="526" />
<img src="http://bbs.e763.com/attachmentse763/month_0808/20080824_2e27fc7a53e2ad5a1211yff5bqxkd6G0.jpg" width="630" height="839" />
<img src="http://bbs.e763.com/attachmentse763/month_0808/20080824_87624e962bea5ca17062lIVbAQtW2Mix.jpg" width="600" height="800" />
</body>
</html>[/html]

ydxiao 发表于 2008-8-28 21:49

没人吗?

cqliudebao 发表于 2008-8-28 22:29

楼主啊，我也遇到这样的问题，以前是考虑IE和其他浏览器兼容的问题，确忽略的浏览器版本的问题，在高版本浏览器显示没问题，在低版本浏览器就是蓝七八糟了~

ydxiao 发表于 2008-8-28 22:56

现在确定是以下问题:
_pl_div.style.position = 'fixed';

fixed对IE7以下的不支持,但要怎么改才能使这个层在IE7以下也能对应的移动呢?

erik168 发表于 2008-8-29 02:48

将所有流布局的内容放在一个width是100%，height是100%，overflow是auto的div中
这个div之外的absolute元素就可以做到fixed的效果

ydxiao 发表于 2008-8-29 11:17

回复 5# erik168 的帖子

楼上能具体实例一下吗?改改我上面的JS代码.

ydxiao 发表于 2008-8-29 20:07

顶起来

ydxiao 发表于 2008-8-30 12:09

:confused: :confused:

ydxiao 发表于 2008-9-2 17:30

:confused: :confused: :confused: :confused:

pboliu 发表于 2008-9-2 19:17

[html]<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>无标题文档</title>
</head>
<body>
<script type="text/javascript">
document.write('<div id="_pl_loading" onmouseover="this.style.display=\'none\'"></div>');
_pl_div = document.getElementById('_pl_loading');

if (window.XMLHttpRequest) {
        _pl_div.style.position = 'fixed';
} else {
        _pl_div.style.position = 'absolute';
}
_pl_div.style.width = '400px';
_pl_div.style.height = '200px';
_pl_div.style.zIndex = 65000;
_pl_clientWidth = document.documentElement.clientWidth ? document.documentElement.clientWidth : document.body.clientWidth;
_pl_clientHeight = document.documentElement.clientHeight ? document.documentElement.clientHeight : document.body.clientHeight;
_pl_div.style.left = ((_pl_clientWidth - 400) / 2) + 'px';
_pl_div.style.top = ((_pl_clientHeight - 200) / 2) + 'px';
_pl_div.className = 'box';
_pl_div.innerHTML = '<h4>温&nbsp;馨&nbsp;提&nbsp;示</h4><img src=\'banner/3zl.jpg\' border=\'0\' align=\'absmiddle\' /><br /><img src=\'images/default/loading.gif\' border=\'0\' align=\'absmiddle\' />&nbsp;正在为您载入页面，请稍候……';
document.body.appendChild(_pl_div)
_pl_alpha('_pl_loading', 70);
function _pl_onload() {
        document.getElementById('_pl_loading').style.display='none';
}
if (document.attachEvent) window.attachEvent('onload',_pl_onload);
else window.addEventListener('load',_pl_onload,false);
function _pl_alpha(obj,al) {
        if(typeof obj != 'object') obj = document.getElementById(obj);
        if(!obj) return;
        var alpha=al/100;
        obj.style.filter = "alpha(opacity:"+al+")";
        obj.style.KHTMLOpacity = alpha;
        obj.style.MozOpacity = alpha;
        obj.style.opacity = alpha;
}
</script>
<table width="500" height="500" border="0" align="center" bgcolor="#00FF00">
  <tr>
    <td>&nbsp;</td>
  </tr>
</table>
<img src="http://bbs.e763.com/attachmentse763/month_0808/20080825_dde00f762cce45c9f747AZov9e7v7PXN.jpg" width="600" height="800" />
<img src="http://bbs.e763.com/attachmentse763/month_0808/20080824_4a506ce05089fab3dd10Nx7eGTpz0bAw.jpg" width="700" height="526" />
<img src="http://bbs.e763.com/attachmentse763/month_0808/20080824_9d975a3392994203c2damT8gjMWnqiiG.jpg" width="700" height="526" />
<img src="http://bbs.e763.com/attachmentse763/month_0808/20080824_7072cdc925c41050f205t711eo0QDDaO.jpg" width="700" height="526" />
<img src="http://bbs.e763.com/attachmentse763/month_0808/20080824_2e27fc7a53e2ad5a1211yff5bqxkd6G0.jpg" width="630" height="839" />
<img src="http://bbs.e763.com/attachmentse763/month_0808/20080824_87624e962bea5ca17062lIVbAQtW2Mix.jpg" width="600" height="800" />
</body>
</html>[/html]

页: [1]



Powered by Discuz! Archiver 6.1.0  © 2001-2007 Comsenz Inc.