Hur sätter man z-index på exempelvis en bild om man vill att det ska funka i både IE och NN?
z-index?
6 svar · 255 visningar · startad av Poppe25
Något i den här stilen:
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;}
}
Tack för koden...försöker förstå den nu.
document.all , document.getElementByID och document.layers returnerar alltså booleska värden, men vad syftar uttrycken till?
Är värdet på variabeln Lager det som styr vilken av if-satserna som ska utföras eller är det i funktionsanropet något döljs?
Och inom vilket intervall kan man sätta z-indexet?
MVH
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.
Har testat dina funktioner men min webbläsare reagerar på att document.all, document.layers och document.getElementById inte är några objekt.
Någon som har en clue om vad som är felet?
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>
tack...ska genast pröva!