Forum: PC-Programmierung Javascript pop up schließen durch klicken


von Nette M. (nette-mann)


Lesenswert?

function viewFoto(img){
  largh=foto1.width+20;
  altez=foto1.height+20;
  stringa="width="+largh+",height="+altez;
  finestra=window.open(img,"",stringa);

Der Teil meine scriptes ruft ein pop up auf und zeigt mir das Bild an. 
Schließen kann ich es nur übers X rechts oben. Daher die Frage, da das 
Ganze mit Javascript geöffnet wird, kann ich z.B. onclick="self.close()" 
ja nich nehmen. Welchen Befehl kann ich aber ins Script schreiben der 
mir das Pop Up schließt beim drauf klicken? Sollte die Glaskugel defekt 
sein, fragt einfach.

von Jens S. (djstorm)


Lesenswert?

Wenn ich mich nicht irre, müsste es finestra.close(); sein...

von Nette M. (nette-mann)


Lesenswert?

dann schließt er es aber sofort nach dem öffnen

von Jens S. (djstorm)


Lesenswert?

Wo genau soll man draufklicken? Auf das aufgerufene Bild im neuen 
Fenster oder auf nen Link im Fenster, das das Bild aufruft?

von Nette M. (nette-mann)


Lesenswert?

Also hast erst ein thumbnail darauf klickste dann gehten Pop Up auf und 
in dem Popup ist ein Bild was vorher das Thumbnail war. Pop Up passt 
sich automatisch der Größe des Bildes an. Und jetzt soll es so sein, 
dass man im Pop Up auf das Bild klickt und es sich danach dann zumacht.

von Jens S. (djstorm)


Lesenswert?

Okay, geht aber nicht, wenn da nur das Bild einfach im neuen Fenster 
geöffnet wird... Im Prinzip muss eine neue HTML-Seite geöffnet werden, 
in der dann das JavaScript zum Schließen eingebettet ist - und damit es 
auch konform ist mit dem kompletten header- und body-Bereich...

Wird PHP verwendet? Dann kann man die Bild-URL an das aufgerufene Script 
im GET-Parameter übergeben und dann durch das Script im HTML-Code 
eingesetzt werden...

Also ganz Grob gesehen so:

[auf der Seite mit den Thumbnails]
...
<img src="xyz_thumb.jpg" 
onclick="viewFoto('./photo.php?pic=xyz_thumb.jpg');">
...

[photo.php]
<?
    $pic="";
    if(isset($_GET["pic"])===true)$pic=$_GET["pic"];
    if(file_exists($pic)===false){
        $pic="";
    }else{
        $size=GetImageSize($pic);
        $width=$size[0];
        $height=$size[1];
    }
?>
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN" 
"http://www.w3.org/TR/html4/strict.dtd">;
<html>
    <head>
        <meta http-equiv="Content-Style-Type" content="text/css">
        <meta name="keywords" content="">
        <meta name="description" content="">
        <meta http-equiv="expires" content="0">
        <title>Detailbild</title>
    </head>
    <body style="margin:0px;">
        <?
            if($pic!=""){
                ?>
                    <img src="<?=$pic?>" style="width:<?=$width?>px; 
height:<?=$height?>px;" alt="" onclick="self.close();"><br />
                <?
            }else{
                echo "Bild nicht gefunden.<br />";
            }
        ?>
    </body>
</html>

von Nette M. (nette-mann)


Lesenswert?

ich werds testen erstmal danke.

von Jens S. (djstorm)


Lesenswert?

Ich sehe gerade, dass du online bist... Hat das Beispiel so geklappt? 
War mal so aus dem Kopf und ungetestet.

Bitte melde dich an um einen Beitrag zu schreiben. Anmeldung ist kostenlos und dauert nur eine Minute.
Bestehender Account
Schon ein Account bei Google/GoogleMail? Keine Anmeldung erforderlich!
Mit Google-Account einloggen
Noch kein Account? Hier anmelden.