DIV über ein <select><option> legen funktioniert nicht
romero
- javascript
Hallo ihr Lieben,
leider komm ich an dieser Stelle nicht weiter.
Ich versuche in mein <body> ein DIV mittels appendChild()
einzufügen. Dabei passiert an der Stelle, wo ich die <select><option>...</option></select>
habe folgendes:
Das DIV wird zwar über alle INPUT's und andere BUTTON's bzw. allgemein gesagt, das Formular gelegt, nur bei dem SELECT bzw. OPTION funktioniert es nicht.
Wie kann ich es also bewerkstelligen, dass das DIV trotzdem über das SELECT bzw. OPTION gelegt wird?
Hab dazu zwar mittels Google was gefunden, wurde daraus aber nicht schlau genug. Deshalb wende ich mich an euch, ob ihr mir dazu eine Hilfe anbieten könnt.
LG Romero
Hallo,
Ich versuche in mein <body> ein DIV mittels
appendChild()
einzufügen.
das ist für den beschriebenen Effekt vermutlich vollkommen unerheblich.
Das DIV wird zwar über alle INPUT's und andere BUTTON's bzw. allgemein gesagt, das Formular gelegt, nur bei dem SELECT bzw. OPTION funktioniert es nicht.
In welchen Browsern tritt der Effekt auf? In allen, oder nur bestimmten?
Wie sieht die genaue Dokumentstruktur aus, die bei der Operation herauskommt? (->Firebug!)
Welche CSS-Eigenschaften haben die beteiligten Elemente? Sind sie absolut positioniert, haben sie untypischen z-index?
Liegt das select-Element komplett im Vordergrund, oder nur die aufgeklappte Liste? Falls letzteres zutrifft, hast du vermutlich keine Chance, weil das vom GUI deines Systems kontrolliert wird.
So long,
Martin
Tach auch,
In welchen Browsern tritt der Effekt auf? In allen, oder nur bestimmten?
Wie sieht die genaue Dokumentstruktur aus, die bei der Operation herauskommt? (->Firebug!)
Welche CSS-Eigenschaften haben die beteiligten Elemente? Sind sie absolut positioniert, haben sie untypischen z-index?
Liegt das select-Element komplett im Vordergrund, oder nur die aufgeklappte Liste? Falls letzteres zutrifft, hast du vermutlich keine Chance, weil das vom GUI deines Systems kontrolliert wird.
Also ich benutze den IE6, wie es bei dem IE8 aussieht, weiß ich nicht, da ich es "noch" nicht getestet hab.
Ich kann nur den IE benutzen, da mein Script ne *.HTA-Datei ist.
Die Doukemtstruktur sieht wie folgt aus:
</head>
<body onKeyPress="return Entersperre(event)" onKeyDown="return F5sperre(event)" onmousedown="return rechteMaussperre()" oncontextmenu="return rechteMaussperre()" onload="init_Basis(); Inhalt_leeren(); load('500'); Fensterhoehe(); Version(); Aufrufe_Script()">
<form id="Auswahl" name="Auswahl" class="Formular">
<table id="Tabelle1" class="Tabelle1" cellspacing="2px">
<tr class="Zeile1">
<td colspan="12"></td>
</tr>
<tr class="Zeile2">
<td class="Spalte1"></td>
<td colspan="10" class="Spalte2">...</td>
<td class="Spalte1"></td>
</tr>
<tr class="Zeile3">
<td colspan="12"></td>
</tr>
<tr class="Zeile4">
<td class="Spalte1"></td>
<td class="Spalte3">Flugzeugtyp:</td>
<td class="Spalte4"><label id="FLTLabel" for="FLT"></label>
<select id="FLT" name="FLT">
<option value="--">Bitte wählen:</option>
<option value="SA1">...</option>
</select></td>
</tr>
...
</table>
</form>
</body>
</html>
Das Einzubindende DIV:
function Screen_Druck_Fenster_Erstellen( ... )
{
var Hintergrund_Transparenz = document.createElement( "div" );
//-----------------------------------------------------------------------------//
//-- Hintergrund, welcher Transparent ist, um das Druckfenster hervorzuheben --//
//-----------------------------------------------------------------------------//
Hintergrund_Transparenz.className = "Hintergrund_Transparenz";
Hintergrund_Transparenz.id = "Hintergrund_Transparenz";
Hintergrund_Transparenz.style.height = document.documentElement.clientHeight + "px";
Hintergrund_Transparenz.style.width = document.documentElement.clientWidth + "px";
};
...
Die dazugehörige CSS-Anweisungen:
<style type="text/css">
/*----------------------------------------*/
/* -- Screen - Ausgabe - Informationen -- */
/*----------------------------------------*/
@media screen {
/*-----------------------------------------------------------*/
/* -- Spalten - Info's allgemein -> für das "Druckfenster -- */
/*-----------------------------------------------------------*/
.Hintergrund_Transparenz { position:absolute; top:0px; left:0px; background-color:#FFFFFF; z-index:1; filter:alpha(opacity=45); }
...
/*-------------------------------*/
/* -- Allgemeine Festlegungen -- */
/*-------------------------------*/
body { background-color:lightblue; font-family:Times; font-size:16px; }
.Formular { width:1126px; margin:auto; }
.Tabelle1 { width:1126px; display:none; margin:0px; padding:0px; border-collapse:collapse; }
...
}
</style>
Also alle DIV's sind (welche ich in den body-Tag) neu einfüge, absolut positioniert und haben auch ein entsprechenden z-index-Faktor (aber nur die neuen DIV's).
Und so wie ich es erkenne, liegt das komplette select-Feld im Vordergrund und dementsprechend auch die aufklappbare Liste.
Soll ich dem "Formular" in eine DIV klappen und diese nen z-index von -1 geben oder so?
Oder wie bewerkstellige ich es "auch" für den IE6 (sofern es bei dem IE8 funktioniert).
LG Romero
Hi!
Da lag ich ja richtig. Erste und wichtigste Frage: Warum den IE6? Die vernuenftigste Alternative ist hier, einen aktuellen Browser zu nutzen.
Ansonsten habe ich schon einige Hinweise gegeben. Mit z-index kommst du nicht weit. Du kannst versuchen das Element unsichtbar zu machen, zu verschieben, es 0 px gross zu machen, ... Fakt ist: Du musst das Element anfassen wenn das Div drubergelegt wird und wenn das Div wieder verschwindet. Ein fetter Bug im IE6, der dir da nette Zusatzarbeit einbrockt.
Grüßle,
Da lag ich ja richtig. Erste und wichtigste Frage: Warum den IE6? Die vernuenftigste Alternative ist hier, einen aktuellen Browser zu nutzen.
Warum der IE6? Nun ja, weil mein Admin bei den Rechnern noch kein besseren draufgehauen hat.
Ich hoffe ja, dass da ein neuerer bald kommt. Aber bis dato muss ich mich leider damit begnügen.
Ansonsten habe ich schon einige Hinweise gegeben. Mit z-index kommst du nicht weit. Du kannst versuchen das Element unsichtbar zu machen, zu verschieben, es 0 px gross zu machen, ... Fakt ist: Du musst das Element anfassen wenn das Div drubergelegt wird und wenn das Div wieder verschwindet. Ein fetter Bug im IE6, der dir da nette Zusatzarbeit einbrockt.
Ok dann werde ich versuchen, es mittels ausblenden oder derartige andere Nettigkeiten, zu überwinden.
Vielen Dank an euch.
LG Romero
Moin!
Ich wuerde wetten, dass Du einen IE benutzt. Ich weiss nicht, ob das in neueren IEs gefixt ist, aber bis IE 6 gibt es fuer dein Problem nur die Moeglichkeit das Select verschwinden zu lassen (verschieben, unsichtbar machen, ...), da es immer durch alle darueber liegenden Elemente scheint. Da hilft auch kein z-index und aehnliches.
Sollte das Phaenomen auch auf "vernuenftigen" Browsern auftauchen, hat Der Martin Dir schon Infos zur weiteren Vorgehensweise gegeben.
Ich habs eben mal geprueft.
Ich bekomme meinen IE8 nicht dazu, dass noch so anzuzeigen. Du macht also etwas komisches oder verwendest einen toten Browser.