function sattIndex (Lager, z){
// Lager är lagerid ; z är z-index
if(document.all){document.all[Lager].style.zIndex=z;}
if(document.getElementById){document.getElementById(Lager).style.zIndex=z;}
if(document.layers){document.layers[Lager].zIndex=z;}
}
Själv använder jag det till en funktion där jag vill lägga ett lager överst:
z=10;
function overst(Lager){
z++;
if(document.all){document.all[Lager].style.zIndex=z;}
if(document.getElementById){document.getElementById(Lager).style.zIndex=z;}
if(document.layers){document.layers[Lager].zIndex=z;}
}
Först, ser ett litet fel i koden jag la upp. z=10; ska naturligtvis vara var z=10; .
Nu är jag långtifrån någon hejare på javascript milt sagt, och koden är till största delen uppsnappad på nätet. Men som jag förstår det, finns stödet för metoderna (?) document.all, document.getElementById respektive dokument.layers i en läsare så returneras true, annars false.
(document.all) returnerar true för IE4+.
(dokument.layers) returnerar true för NN4.
(document.getElementById) returnerar true för IE5+, Mozilla, Netscape 6+, Opera (vet ej från vilken version) m.fl läsare främst gecko-baserade.
document.all, document.layers och document.getElementById representerar de olika DOM (Document Object Model) som de olika webbläsarna använder. Vilken DOM som hör till vilken webbläsare har redan beskrivits.
Här är ett litet, men komplett exempel;
<script language="JavaScript" type="text/javascript">
var n=5;
function moveLayerToTop(Layer){
n++;
sattIndex(Layer,n);
}
function sattIndex(Lager,z){
// Lager är lagerid ; z är z-index
if(document.all){document.all[Lager].style.zIndex=z;}
if(document.getElementById){document.getElementById(Lager).style.zIndex=z;}
if(document.layers){document.layers[Lager].zIndex=z;}
}
</script>
<div id="foo" style="position:absolute;top:50px;left:50px;width:200px;height:200px;background-color:green;">
<a href="#" onClick="moveLayerToTop('foo');">Flytta överst</a>
</div>
<div id="bar" style="position:absolute;top:100px;left:100px;width:200px;height:200px;background-color:red;" align="right">
<a href="#" onClick="moveLayerToTop('bar');">Flytta överst</a>
</div>