Absolutes DIV innerhalb aber außerhalb?

[pekka]

Ich habe eine Situation, in der hintereinander einzelne Eingabeelemente in einem Formular gerendert werden. Das Formular ist eine Seite in einem Javascript-gestützten Tab-Control (Das hier). Die Seite ist natürlich ebenfalls ein DIV, mit overflow: auto.

Eines dieser Eingabeelemente beinhaltet nun ein 400x400 Pixel großes, verstecktes Dialog-DIV zum Nachschlagen in einer Liste, das auf Knopfdruck geöffnet und zentriert angezeigt werden soll.

Es kann sein, daß das Dialog-DIV größer ist als die Tab-Seite, in der es drin ist. Problem ist nun: Egal ob ich absolut oder fixed positioniere, das Dialog-DIV ist immer ein Unterelement der Tab-Seite, deren Kind es HTML-Technisch ist! D.h. das Dialog-DIV kann nicht über die Tag-Seite hinausschauen, und wenn ich versuche, es mit der Scriptaculous-Funktion Center() zu zentrieren, wird es relativ zur Tab-Seite zentriert und nicht zur gesamten Seitenfläche.

Das Dialog-DIV außerhalb auszugeben möchte ich möglichst vermeiden, weil der ganze Ablauf Teil eines jetzt schon sehr komplexen, plugin-basierten Prozesses ist.

Das Seiten-DIV schließen, das Dialog-DIV rendern und das Seiten-DIV wieder öffnen geht auch nicht, weil das das Tab-Control kaputtmacht.

Kennt jemand einen Trick, wie ich das DIV HTML-Technisch innerhalb der Tab-Seite rendern kann (also DIV im DIV) und das Dialog-DIV layouttechnisch trotzdem frei auf der Seite bewegen kann?

Anbei noch eine Illustration des Problems.

[Kropff]

mal probiert, ohne position: relative und nur mit display bei den einzelnen tabs zu arbeiten 8also ohne z-index). und bei dialog-div dann mit position: absolute?

peter

[pekka]

Original geschrieben von Kropff
mal probiert, ohne position: relative und nur mit display bei den einzelnen tabs zu arbeiten 8also ohne z-index). und bei dialog-div dann mit position: absolute?

peter

Das Problem ist, die Tab-Seiten sind ein schon in vielen Installationen verbautes Control, und wenn ich den Display ändere gibts wieder Ärger mit dem Farbselektor, der ein absolut positioniertes DIV aufklappt usw. usf Das ist jetzt erfunden aber du weißt was ich meine.

In diesem Fall hab ich beschlossen, daß es das sinnvollste ist, das Dialog-DIV automatisch per Javascript zu generieren. (Ist eh ein CMS mit Javascript-Pflicht).

Also so, für die Nachwelt:

    temp_selector = document.createElement('div');
          temp_selector.setAttribute('id', 'selector');
          temp_selector.setAttribute('class', 'selector');
          temp_selector.style.display = 'none';
         
          temp_selector_head_wrapper = document.createElement('div');
          temp_selector_head_wrapper.setAttribute('id', 'selector_head');
          temp_selector_head_wrapper.setAttribute('class', 'head_wrapper');
         
          temp_selector_head = document.createElement('div');
          temp_selector_head.setAttribute('class', 'head'); 

... und so weiter.... 
... und dann zusammenkleben: ...
         
          temp_selector.appendChild(temp_selector_head_wrapper);
          temp_selector.appendChild(temp_selector_content);
         
... letzte Amtshandlung: Dialogfenster an den Body kleben.        

          document.body.appendChild(temp_selector);