webForumDet fria alternativet

z-index?

JavaScript

6 svar · 257 visningar · startad av Poppe25

Medlem sedan apr. 2002255 inlägg
Frågan#1

Hur sätter man z-index på exempelvis en bild om man vill att det ska funka i både IE och NN?

Medlem sedan aug. 20002 975 inlägg
#2

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;}
}
Medlem sedan apr. 2002255 inlägg
#3

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

Medlem sedan aug. 20002 975 inlägg
#4

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.

Medlem sedan apr. 2002255 inlägg
#5

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?

Medlem sedan juni 20004 308 inlägg
#6

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>
Medlem sedan apr. 2002255 inlägg
#7

tack...ska genast pröva!

270 ms totalt · 4 externa anrop · v20260731065814-full.6fe65c25
129 ms — deklarationer (db)
0 ms — hämta statistik (cache)
136 ms — hämta tråd, inlägg och bilagor (db)
130 ms — ändringar (db)