PopUp...mal wieder

R

Receiver

Erfahrenes Mitglied
Hallo!

Ich habe folgendes Problem:
Meine Seite besteht im eigentlichen Layout aus Tabellen, wobei eine Tabellenzelle ein iframe ist. In diesem iframe lasse ich nun verschiedene Thumbnails von irgendwelchen Bildern anzeigen.
Wenn man jetzt auf die Thumbs klickt sollte nach möglichkeit folgendes passieren:
Ein PopUp öffnet sich, in dem die große Version des Bildes angezeigt wird. Dabei soll die Fenstergröße auch schon beim öffnen vorgegeben sein, damit nach möglichkeit die Fenstergröße schon so ist, dass man nicht erst noch scrollen muss. Außerdem wäre es noch ganz cool, dass wenn man auf das sich geöffnete Bild klickt, das Fenster sich wieder von selbst schließt.
Ich denke mal, dass das ganze irgendwie über ne Funktion laufen muss, die als Parameter den Dateinamen übergeben bekommt, aber da ich seit mehreren Jahren schon nichts mehr mit JavaScript gemacht habe stehe ich nun irgendwie auf dem Schlauch...
Auch die Sachen von Selfhtml bringen mich irgendwie nicht weiter, weil ich in den unmengen an unterklassen und Methoden irgendwie den Überblick verliere...

Danke schon mal im Vorraus für eure Vorschläge!

PS:
Wenn jemand ne andere Idee hat, wie man die Bilder ohne PopUp anzeigen kann (zum Beispiel durch nen "Layer -> geht sowas überhaupt in der Praxis vernünftig?), dann nur her damit :-)
 
Hi,

wie ein PopUp mit bestimmten Attributen über eine Funktion geöffnet wird, findest Du hier im Forum zu hauf.

Ein Beispiel für eine Anwendung mit einem DIV habe hier:
PHP: 
<script language="JavaScript" type="text/JavaScript">
function showImg(picname) {
    var d = document.getElementById("Layer1");
    if (picname!="") {
        d.innerHTML="<img src='"+picname+"'>";
        d.style.visibility="visible";
    } else {
        d.style.visibility="hidden";
    }
}
</script>
</head>
<body>
<div id="Layer1" style="position:absolute; width:200px; height:200; left: 10; top: 50; visibility: hidden"></div>
<p> 
  <input name="button1" type="button" id="button1" value="Bild anzeigen" onClick="showImg(textfield1.value)">
  <input name="textfield1" type="text" id="textfield1">
</p>
</body>
Wenn die Bilder verschieden groß sind, kannst Du die Maße des DIVs in der Funktion auch entsprechend ändern, oder mit dem overflow-Attribut spielen. ;)

Gruß
 
Danke für den Tip!
Da ich allerdings die Thumbnails in nem recht kleinen iframe habe , würde das Platzmäßig schon gar nicht passen, dass ich da ein div-tag einbaue, über das dann die Grafik angezeigt wird.
Habe mich also eben noch mal was hingesetzt und die PopUp Lösung versucht. Soweit funktioniert das auch alles, nur hätte ich halt noch gerne, dass wenn man auf das Bild klickt, dass sich im PopUp geöffnet hat, sich das Fenster wieder schließt.
Dazu habe ich also ne leere HTML-Datei genommen, und lasse dann per "writeln" den nötigen Quelltext reinschreiben. Nur irgendwas nicht so ganz...hat vielleicht jemand ne Idee, was ich falsch gemacht habe:

Code: 
<html>
<body leftmargin='0' topmargin='0' marginwidth='0' marginheight='0'>
<center>
   <a href='javascript:window.document.close()'>
      <img src='images/001.jpg' border=0>
   </a>
</center>
</body>
</html>

-> Das hier ist also der Quelltext, der beim erzeugen des PopUp's erzeugt wird. Wie Ihr euch vielleicht denken könnt, passiert NICHTS wenn man auf das Bild klickt..

THX
 
lass mal das "document" weg. - oder nimm keinen Link, sondern setze ein onClick-Event in das img-Tag:
Code: 
<img src='images/001.jpg' border=0 onClick="javascript:window.close()">


Gruß
 
Um antworten zu können musst du eingeloggt sein.

Neue Beiträge

Zurück