• Das Erstellen neuer Accounts wurde ausgesetzt. Bei berechtigtem Interesse bitte Kontaktaufnahme über die üblichen Wege. Beste Grüße der Admin

z-index bei div

Concept-X

New member
Hi,
habe ein Problem mit einem div-Element...
Es geht darum ein div-Element vor ein bestimmtes td-Feld zu bekommen...
Dabei sollte es aber wiederrum hinter die anderen kommen...

Um das ganze etwas besser zu erklären:
lA8fDxLMGe21clq.gif


Das div-Element soll somit hinter einen Teil des body(s) und komplett hinter ein anderes td-Element...
Da ich weder bei body noch mit td einen z-index einbauen kann, bekomme ich das Problem, dass ich diesen Teil des divs nicht wegbekomme...

Die erste Lösung dafür wäre natürlich das div-Element in der Größe zu verändern, sodass es nur in dem einen td-Feld existiert...
Allerdings wäre das für meine Verwendungszwecke etwas unpraktisch, da es sich um eine Art Animation handelt, bei der ich die die Größe nur ungern in jedem Schritt verändern möchte...

Dann dachte ich daran einen body-container zu machen(z-index:0) und dann für den Bereich wo es sichtbar ist einen weiteren(z-index:-1 oder 1?) und genau darin liegt das Problem... es geht so auch nicht, da man in diesem Fall ja eine Art Dauerschleife vorliegen hat...(also body: 0, td: 1, container: 2(wegen td) und aber auch -1(wegen body))...

Nun weiß ich aber nicht mehr weiter =(
Ich hoffe ihr habt verstanden was mein Problem ist und könnt mir irgendwie ein Lösung geben...
 
Anstatt dein Beispiel theoretisch nacharbeiten zu müssen wäre ein Link nicht schlecht.
 
Naja, einen Link zu einer Seite die es bereits schonmal geschafft kann ich nicht geben und die Seite zu der ich das brauche ist nicht öffentlich zugänglich, sondern nur bestimmten Nutzern vorbehalten, daher kann ich da auch keinen Link geben...

Aber ich könnte ein Bsp(Quelltext) geben:

Also so etwa sieht das ganze aus:
<html><head><title>Nur zum veranschaulichen</title>
<style type="text/css">
#position{
left: 5px;
top: 100px;
width: 100px;
height: 100px;
position: absolute;
background-color:#00FF00;
}
</style>
</head><body>
<table border="1" height="90%" width="90%">
<tr>
<td rowspan="2" width="10">...</td>
</tr>
<tr>
<td width="90%">Inhalt</td>
<td>...</td>
</tr>
</table>
<div id="position">Inhalt</div>
</body>
</html>

Das ist sicherlich jetzt nicht der beste Code... habe es nur so annähernd versucht darzustellen... das meiste ist stark vom php-Code abhängig und aber auch von javascript... aber darum soll es nicht gehen...
Meine Grundfrage ist da eher, ob es mittels CSS möglich ist diesen(im Bsp grünen Kasten) so zu splitten, dass er erst im <td>Inhalt</td> zu sehen ist und nicht in dem vorhergehenden <td>-Feld oder auch nicht im <body>...

Oder vielleicht gibt es da auch Tricks? Z.B. noch einen <div> drüber legen, der es irgendwie schafft diesen grünen Kasten bis zu der sichtbaren Grenze zu überdecken und dabei aber vollkommen transparent zum body und zu dem anderen <td> bleibt

Meine letzte Lösung wäre es diesen Kasten bei jedem Animationsschritt mittels javascript zu vergrößern...
 
Zurück
Oben