[JavaScript] z-Index 'on the fly' ändern?

NudelMC · 7 März 2007

Hallo,

ich versuche mich gerade an einem Kalender.
Das klappt soweit auch alles ganz gut…

Nun wird an jedem Tag an dem ein Termin ansteht ein link erzeugt.
Wenn man sich nun den Termin genauer ansehen will muss man draufklicken.
Um mir den roundtrip zu sparen würde ich das gerne mit Ajax machen.
Allerdings stoße ich schon beim Versuch den z-Index eines divs zu erhöhen an meine Grenzen 

PHP:

<script type="text/javascript">
    function openKalender()
    {   
        var obj = document.getElementById("KalenderDiv");
        obj.style.zIndex=10;
        alert(obj.style.zIndex);	
    }
</script>


<div id="KalenderDiv" style="position:absolute; left:0px; top:0px; z-index:1; width:100%;">
Hier dann die Details…
</div>

Der Alert alert(obj.style.zIndex); gibt mir 10 als Ergebniss, deshalb bin ich etwas stutzig...

Die Divs die drüber liegen haben maximal einen zindex von 5

Bin für alle Ideen offen

theHacker · 7 März 2007

Also bei mir funktioniert es :think:

Probier mal das:

HTML:

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN">
<html><head>
<meta http-equiv="content-type" content="text/html; charset=ISO-8859-1">
<title>z-index</title>
</head><body>

<div style="position:absolute; top:100px; left:100px; z-index:2; border:1px solid #888; background:#f88;">
  <b>A:2</b><img src="https://de.selfhtml.org/css/eigenschaften/anzeige/hund.gif" width="208" height="181" alt="Hund">
</div>

<div style="position:absolute; top:130px; left:130px; z-index:1; border:1px solid #888; background:#88f;">
  <b>B:1</b><img src="https://de.selfhtml.org/css/eigenschaften/anzeige/hund.gif" width="208" height="181" alt="Hund">

</div>

<div style="position:absolute; top:190px; left:270px; width:300px; height:280px; z-index:3;
            border:1px solid #888; background:#eee;">
  <b>C:3</b>
  
  <div id="div2" style="position:absolute; top:30px; left:-30px; z-index:2; border:1px solid #888; background:#8f8;">
    <b>!!! D:2 !!!</b><img src="https://de.selfhtml.org/css/eigenschaften/anzeige/hund.gif" width="208" height="181" alt="Hund">
  </div>

  <div style="position:absolute; top:-30px; left:40px; z-index:3; border:1px solid #888; background:#ff8;">
    <b>E:3</b><img src="https://de.selfhtml.org/css/eigenschaften/anzeige/hund.gif" width="208" height="181" alt="Hund">

  </div>

  <div style="position:absolute; top:60px; left:-60px; z-index:-1; border:1px solid #888; background:#8ff;">
    <b>F:-1</b><img src="https://de.selfhtml.org/css/eigenschaften/anzeige/hund.gif" width="208" height="181" alt="Hund">
  </div>
</div>

<p><a href="../positionierung.htm#z_index">zurück</a></p>

<script type="text/javascript">
<!--
function foo()
{
  // direkt
  alert(document.getElementById("div2").style.zIndex);
  document.getElementById("div2").style.zIndex=10;
  alert(document.getElementById("div2").style.zIndex);
  
  // mit Obj-Var
  var obj=document.getElementById("div2");
  alert(obj.style.zIndex);
  obj.style.zIndex=2;
  alert(obj.style.zIndex);
}
//-->
</script>
<form><input type="button" onclick="foo()" value="DO IT !" /></form>

</body>
</html>

Von SelfHTML das Beispiel genommen und den grünen Hund per Button in den Vordergrund gestellt.

NudelMC · 7 März 2007

mh jo danke.

Ich bin mitlerweile soweit das es niht an mir liegt sondern an den verwendeten .NET Komponenten.

Die halten sich einfach net an den zindex ...

Trotzdem Danke, ich such ne Möglichkeit das zu umgehen

Cryptkeeper · 7 März 2007

Hm... mir ist kein Problem mit dem zIndex bei .Net Controls bekannt. Beachtest du, dass der DIV nicht seinen Parent überdecken kann, egal wie hoch der zIndex ist?

Wenn du magst kannst du ja mal den ganzen Code (meinetwegen auch per PM) oder nen Link auf die ASPX posten, dann kann ich bei Gelegenheit drüber gucken.

NudelMC · 7 März 2007

habs schon gebastelt, danke.
Das Problem lag bei der Kalender Componente.

Cryptkeeper · 7 März 2007

Oki, kein Problem.
Viel Erfolg noch =).

[JavaScript] z-Index 'on the fly' ändern?

NudelMC

Well-known member

theHacker

sieht vor lauter Ads den Content nicht mehr

NudelMC

Well-known member

Cryptkeeper

Well-known member

NudelMC

Well-known member

Cryptkeeper

Well-known member

Ähnliche Themen