yubb.de-Logo
Tutorials
yubb@yubb
yubbService
Inside yubb

Das etwas andere PopUp



PopUps kennt jeder. Hier gibt es aber eine andere Version der PopUps: Ohne jegliche Leisten und es schließt sich, nachdem man ausserhalb des PopUps geklickt hat. (Demo)

Füge folgenden Code in den <head>...</head>-Bereich ein:

Code:
<SCRIPT LANGUAGE="JScript">
var oPopup = window.createPopup();
function openPopup()
{
var oPopBody = oPopup.document.body;
oPopBody.innerHTML = "<div style='position:absolute; top:0; left:0; " +
"width:110px; height:100px; " + "background : background;> " +
"<hr size='0'>" + " <img src='images/news_yubb.jpg'></div>"
oPopup.show(-220, 160, 110, 100, document.body);
}
</SCRIPT>


und dies muss als Aufruf eingefügt werden:
Code:

<a href="#" ONCLICK="openPopup();">Öffne PopUp</a>


Nun noch einige Angaben und schon läufts:
An der Stelle
Code:
width:110px; height:100px;
musst die Breite (width) und Höhe (height) in Pixel angeben. Diese Angaben finden sich auch in der Zeile
Code:
oPopup.show(-220, 160, 110, 100, document.body);
Dementsprechend muss es auch hier geändert werden. Die anderen 2 Zahlen davor geben die x und y-Koordinaten an, wo das PopUp erscheinen soll. Also wählst du 0,0 ,so erscheint das PopUp genau links oben in der Ecke.

Und das wichtigste: Der Inhalt. Du kannst ihn dort einfügen, wo z.Z. noch
Code:
<hr size='0'>" + " <img src='images/news_yubb.jpg'>
steht.

Geschrieben von Phil Marx am 18.06.2004 (7453x gelesen)
weiterempfehlen weiterempfehlen   Druckversion Druckversion   kommentieren kommentieren

Bei mir kommt auf der Demoseite nur : Fertig, es sind Fehler aufgetreten und das Popup laesst sich auch nicht oeffnen ;-) IE5.0
Geschrieben von Airport1
Die Beispiele sind ja schön und gut, auch das mit dem etwas anderen Pop-Up: Aber was Mickrigsoft kapiert ignoriert Notscape usw.
Vielleicht mal irgendwo angeben, bei welchen Browsern die Beispiele des Tutorials funktionieren!
Geschrieben von Marian Grabe