Centrering af layer ved resize i Netscape 4!
Hejsa!Allerførst undskyld den lange postning af kode, men jeg tror, at det er den nemmeste måde for folk at overskue problemet. For at der ikke skal været for meget kode har jeg kun medtaget koden der bruges i Netscape 4.
Det første kodeeksempel virker fint i Netscape 4. Når man resizer sit vindue bliver layeret centreret igen.
I det andet kodeeksempel er der indsat to <SPAN>-elementer inden i layeret. Når der resizes i Netscape 4, så forsvinder baggrundsfarven i layeret og det placeres øverst i venstre hjørne.
Hvorfor det?
/David
---------- Start på kode der virker ----------
<html>
<head>
<title>Centreret layer</title>
<meta http-equiv=\"Content-Type\" content=\"text/html; charset=iso-8859-1\">
<script language=\"JavaScript\">
<!--
function reloadPage(init) { //reloads the window if Nav4 resized
if (init==true) with (navigator) {if ((appName==\"Netscape\")&&(parseInt(appVersion)==4)) {
document.pgW=innerWidth; document.pgH=innerHeight; onresize=reloadPage; }}
else if (innerWidth!=document.pgW || innerHeight!=document.pgH) location.reload();
}
reloadPage(true);
function findObj(n, d) {
var p,i,x; if(!d) d=document; if((p=n.indexOf(\"?\"))>0&&parent.frames.length) {
d=parent.frames[n.substring(p+1)].document; n=n.substring(0,p);}
if(!(x=d[n])&&d.all) x=d.all[n]; for (i=0;!x&&i<d.forms.length;i++) x=d.forms[i][n];
for(i=0;!x&&d.layers&&i<d.layers.length;i++) x=findObj(n,d.layers[i].document); return x;
}
function tmt_findObj(n){
var x,t; if((n.indexOf(\"?\"))>0&&parent.frames.length){t=n.split(\"?\");
x=eval(\"parent.frames[\'\"+t[1]+\"\'].document.getElementById(\'\"+t[0]+\"\')\");
}else{x=document.getElementById(n)}return x;
}
//-->
</script>
</head>
<body bgcolor=\"#FFFFFF\" onLoad=\"size()\" onResize=\"size()\">
<script language=\"JavaScript\">
function size(){
manu=navigator.appName;
vers=navigator.appVersion;
layerRef = (document.getElementById) ? tmt_findObj(\"baggrund\") : findObj(\"baggrund\");
//Netscape 4.0+
if (manu.indexOf(\"Netscape\")>=0 && vers.indexOf(\"4\")>=0)
{
winW = window.innerWidth-16;
layerRef.left = ((winW-280)/2);
}
}
</script>
<div id=\"baggrund\" style=\"position:absolute; width:280px; height:28px; z-index:1; top: 50; left: 10; background-color: #a0a0a0; layer-background-color: #a0a0a0; border: 1px none #000000\">
<table width=\"280\" border=\"1\" cellspacing=\"0\" cellpadding=\"0\" height=\"28\" bordercolor=\"#000000\">
<tr align=\"center\" valign=\"middle\">
<td>Centreret layer</td>
</tr>
</table>
</div>
</body>
</html>
---------- Slut på kode der virker ----------
---------- Start på kode der ikke virker ----------
<html>
<head>
<title>Centreret layer</title>
<meta http-equiv=\"Content-Type\" content=\"text/html; charset=iso-8859-1\">
<script language=\"JavaScript\">
<!--
function reloadPage(init) { //reloads the window if Nav4 resized
if (init==true) with (navigator) {if ((appName==\"Netscape\")&&(parseInt(appVersion)==4)) {
document.pgW=innerWidth; document.pgH=innerHeight; onresize=reloadPage; }}
else if (innerWidth!=document.pgW || innerHeight!=document.pgH) location.reload();
}
reloadPage(true);
function findObj(n, d) {
var p,i,x; if(!d) d=document; if((p=n.indexOf(\"?\"))>0&&parent.frames.length) {
d=parent.frames[n.substring(p+1)].document; n=n.substring(0,p);}
if(!(x=d[n])&&d.all) x=d.all[n]; for (i=0;!x&&i<d.forms.length;i++) x=d.forms[i][n];
for(i=0;!x&&d.layers&&i<d.layers.length;i++) x=findObj(n,d.layers[i].document); return x;
}
function tmt_findObj(n){
var x,t; if((n.indexOf(\"?\"))>0&&parent.frames.length){t=n.split(\"?\");
x=eval(\"parent.frames[\'\"+t[1]+\"\'].document.getElementById(\'\"+t[0]+\"\')\");
}else{x=document.getElementById(n)}return x;
}
//-->
</script>
</head>
<body bgcolor=\"#FFFFFF\" onLoad=\"size()\" onResize=\"size()\">
<script language=\"JavaScript\">
function size(){
manu=navigator.appName;
vers=navigator.appVersion;
layerRef = (document.getElementById) ? tmt_findObj(\"baggrund\") : findObj(\"baggrund\");
//Netscape 4.0+
if (manu.indexOf(\"Netscape\")>=0 && vers.indexOf(\"4\")>=0)
{
winW = window.innerWidth-16;
layerRef.left = ((winW-280)/2);
}
}
</script>
<div id=\"baggrund\" style=\"position:absolute; width:280px; height:28px; z-index:1; top: 50; left: 10; background-color: #a0a0a0; layer-background-color: #a0a0a0; border: 1px none #000000\">
<span id=\"Linie1\" style=\"position:absolute; z-index:1; left: 0; top: 0; visibility: visible\" class=\"cursor\"> </span>
<span id=\"Linie2\" style=\"position:absolute; z-index:2; left: 0; top: 20; visibility: visible\" class=\"cursor\"> </span>
<table width=\"280\" border=\"1\" cellspacing=\"0\" cellpadding=\"0\" height=\"28\" bordercolor=\"#000000\">
<tr align=\"center\" valign=\"middle\">
<td>Centreret layer</td>
</tr>
</table>
</div>
</body>
</html>
---------- Slut på kode der ikke virker ----------