Javascript und Layer

[Dicker]

Hallo
erstmal einen Guten Tag. Ich bin neu in eurem Forum. Da ich gerade am Lernen von Javascript bin hoffe ich bei Euch Tips und Ratschläge zu bekommen.

Ich habe da gleich ein Problem mit diesem.

Ich habe eine Intranet-Seite erstellt mit Javascript und PHP. Meine arbeit daran war alles in einem Popup laufen zu lassen. So weit so gut, dies funktioniert auch wunderbar. Aber nun bekam ich den Auftrag alles von mir in Layer zu packen. Und nun bin ich vollkommen ratlos. Ich habe mir schon Bücher und Onlinehilfen zu diesem thema angesehen, aber das brachte mich nicht weiter. Meine frage an euchist, könnt ihr mir eine kleine hilfestellung zum Anfang geben? Wie muß ich mit Layern anfangen? Wenn ich das kann, dann wird der Rest bestimmt nicht mehr so schlimm werden.

Danke im vorraus an alle die mir Antworten
Dicker

[Blackgreetz]

Wo ist denn jetzt genau das Problem?

Ein Layer ist doch in der Theorie nur ein Bereich, der über allem anderen steht: position:absolute;

Ansonsten weiß ich jetzt nicht, wo du jetzt hilfe brauchst, da ja auch google etwas ausspuckt zum Thema "javascript layer erstellen".

mfg

[Dicker]

Ich weiß nicht wie und wo ich ansezten muß um das bestehende (Popup) in einen Layer zu wandeln.
Kann ich einen Teil des Codes weiterverwenden oder muß ich alles neu schreiben?
Wie sieht es mit den bestehenden Javascript und php finktionen aus?

Mit fehlt hier vollkommen der Durchblick

Dicker

[Kropff]

Original geschrieben von Dicker
Ich weiß nicht wie und wo ich ansezten muß um das bestehende (Popup) in einen Layer zu wandeln.
Kann ich einen Teil des Codes weiterverwenden oder muß ich alles neu schreiben?
Wie sieht es mit den bestehenden Javascript und php finktionen aus?

Mit fehlt hier vollkommen der Durchblick

Dicker

uns auch. so lange du nicht mehr informationen lieferst. und was verstehst du unter layern?

peter

[Blackgreetz]

Wir kennen dein Javascript für den Popup ja nicht, sodass man dazu nur allgemeine Aussagen treffen kann:

Im Popup wird eine Seite aufgerufen, im Layer meistens nicht, außer du nutzt einen Iframe.
Wenn du keinen Iframe nutzt, dann musst du den Quelltext der Seite in dem Layer darstellen aber über andere Wege.

Das ganze kann man sich natürlich selber herleiten..

Vielleicht müsstest du dir Gedanken machen, was für dich eigentlich ein Layer ist.

mfg

[Dicker]

Ich meine mit Layer, <div=style.....>Und dies auch mehrschichtig.
Die Anwendung bisher besteht aus einem popupfenster in dem sich nach un nach 5 frames öffnen und schliessen. So habe ich die jetzige Programmierung verstanden.
Aber nun stehe ich vor dem Problem das alles ohne Popup zu machen.Und da stoße ich an meine Grenzen.

Ich weiß nicht wie und wo ich anfangen muß. Oder sollen die einzelnen Frames in >div....> gepackt werden?

Dicker

[Kropff]

Oder sollen die einzelnen Frames in >div....> gepackt werden?

vermutlich. dem jeweiligen eine breiten- und höhenangabe verpassen und dann overflow: auto setzen. ... und anschließend javascript komplett umschreiben .

peter

[ezkimo]

Das gleiche trug mir auch ein Kunde vor einiger Zeit auf. Das Problem ist gar nicht so schwierig.

Anhand des DOM's legst Du einfach mittels den entsprechenden Javascript Funktionen einen <div>-Container über die bestehende Seite. Das "über die Seite legen" kannst Du mit der CSS Eigenschaft [z-index] und entsprechenden Positionsangaben verwirklichen. Die richtest also mittels Javascript einfach überlappende Elemente ein, in denen dann etwas dargestellt wird.

Beispiel Javascript:

function createNewLayer() {
    var myDiv = document.createElement('div');
    myDiv.className = 'layerOptions'; // weist dem erzeugten div Element die CSS Klasse layerOptions zu
    document.getElementById('bla').appendChild(myDiv);
}

Beispiel CSS:

.layerOptions {
    position:absolute; 
    top:100px; 
    left:100px; 
    z-index:2; 
    border:1px solid #ff0000;
}

Somit kannst Du die Javascript Funktion createNewLayer() aufrufen, die dir dann einen neuen Div Container erzeugt und diesen dann schichtweise über die vorhandene Seite legt.

PS: Beispiel ungetestet.

[Dicker]

Danke ezkimo

Klasse antwort. Hat mir sehr geholfen. ICh hätte aber noch eine Frage dazu.
Reicht es wenn ich dem
"document.getElementById('bla').appendChild(myDiv)" die Table der einzelnen Frames übergebe?
Oder sehe ich das flasch?

Danke im vorraus
Dicker

[ezkimo]

Natürlich könntest Du dann in dem neu generierten div alles mögliche an HTML reinschreiben. Auch eben eine Frame-Struktur. Nur würde ich persönlich prüfen, ob wirklich eine Tabelle und Frames in Hinsicht auf eine leicht zu pflegende CSS / HTML Struktur notwendig sind.

[Dicker]

Genau da liegt mein Problem.
In den jetzigen popups sind sehr viele Elemente und tables verbaut. Und meine kenntnisse sind noch sehr mager im Bezug auf html und Javascript.
Den Code den du mir geschrieben hast verstehe ich, aber ich habe halt noch Probleme diesen richtig einzubauen.
Auch laufen noch sehr viele php und javascript funktionen mit.
Deswegen dachte ich mir eben das ich die tables übergebe.
Wenn ich dich richtig verstanden habe, dann meinst du aber, das ich besser alle einzelnen Elemente dem <div> übergeben sollte.

Ich werde versuchen es so zu machen.

Dicker

[Dicker]

Ich weiß nicht mehr weiter.
Ich habe mir folgendes überlegt gehabt:
Mittels der function erzeuge ich die <div>. Und mittels einer switch abfrage soll der passende Table in das <div> gesetzt werden.

Meine Funktion ist folgendermaßen:

var tabId;
function createNewLayer(tabId)
{
var tabId = document.getElementById('id');
var myDiv = document.createElement('div');
myDiv.className = 'layerOptions';
switch (tabId)
{
case 1:
document.getElementById('tabId').appendChild(myDiv);
break;
case 2:
document.getElementById('tabId').appendChild(myDiv);
break;
case 3:
document.getElementById('tabId').appendChild(myDiv);
break;
case 4:
document.getElementById('tabId').appendChild(myDiv);
break;
case 5:
document.getElementById('tabId').appendChild(myDiv);
break;
case 6:
document.getElementById('tabId').appendChild(myDiv);
break;
case 7:
document.getElementById('tabId').appendChild(myDiv);
break;
case 8:
document.getElementById('tabId').appendChild(myDiv);
break;
case 9:
document.getElementById('tabId').appendChild(myDiv);
break;
case 10:
document.getElementById('tabId').appendChild(myDiv);
break;
case 11:
document.getElementById('tabId').appendChild(myDiv);
break;
case 12:
document.getElementById('tabId').appendChild(myDiv);
break;
case 13:
document.getElementById('tabId').appendChild(myDiv);
break;
case 14:
document.getElementById('tabId').appendChild(myDiv);
break;
case 15:
document.getElementById('tabId').appendChild(myDiv);
break;
case 16:
document.getElementById('tabId').appendChild(myDiv);
break;
case 17:
document.getElementById('tabId').appendChild(myDiv);
break;
default:
}
}

Den Aufruf mache ich über eine onload-function und das laden mache ich mittels :

<table id="17" onload="function createNewLayer(id)"; width="960" height="100%" border="0" cellpadding="0" cellspacing="0">

Aber nichts funktioniert. Könnt ihr mir sagen wo mein Denkfehler liegt?

Gruß
Dicker

[Kropff]

onload funktioniert nur im body-tag. und das hier

onload="function createNewLayer(id)"; 

sollte ja wohl so aussehen

onload="createNewLayer(id);" 

das heißt, dass dein konzept überhaupt nicht funktionieren kann.

peter

[Dicker]

Danke Peter
den Fehler hatte ich übersehen. Aber trotzdem klappt es nicht.

[ezkimo]

Re: Javascript und Layer

Also irgendwie kommt mir das hier alles etwas komisch vor. Im eröffnenden Beitrag schreibst Du:

Original geschrieben von Dicker
Ich habe eine Intranet-Seite erstellt mit Javascript und PHP.

und dann machst Du so elementare Fehler wie:

document.getElementById('tabId').appendChild(myDiv);

Richtig muss es lauten:

document.getElementById(tabId).appendChild(myDiv);

Mach das alles doch im Firefox und schau Dir dort die Fehlerkonsole an. Dann siehst Du, wo die Fehler sind.