großes Bild in dynamischer HTML Datei erzeugen



  • Hallo,
    ich würde gerne auf einer HTML Seite Thumbnails haben, welche das dazu gehörige große Bild in einer dynamisch erstellten HTML Datei als Popup in der dem Bild entsprechenden Größe anzeigen. Mit Klick auf das große Bild, soll dieses geschloßen werden.
    Wenn ein anderes Thumbnail angeklickt wird, so soll das neue große Bild in dem eventuell noch geöffnetem Popup geladen werden, sowie die Größe ggf. angepasst werden.

    MfG



  • Und was genau ist jetzt deine Frage, oder erwartest du etwas feritgen Code?! 😉
    Wenn du das ganze über JavaScrip-Popups machen willst, hast du allerdings das Problem, dass Leute, die das deaktiviert haben die Groß-Ansicht nicht sehen.


  • Mod

    abgesehen davon, dass es echt gemein ist, dem user ein fenster zu 'übermalen'. Was wenn der user 3 bilder gleichzeitig betrachten will? warum es ihm verbieten?



  • Ich habe da mal was zusammengebastellt:

    <!--- Hide script from old browsers
    function popUpWindow(picture,title,width,height)
    {
    
    ScreenWidth = screen.width;
    ScreenHeight = screen.height;
    
    // Um Bild in der Mitte anzuzeigen
    xpos = (ScreenWidth/2)-(width/2);
    ypos = (ScreenHeight/2)-(height/2);
    
    	NewWindow=window.open("","picture","width="+width+",height="+height+",menubars=no,statusbar=no,locationbar=no,scrollbars=no,resizable=no,top="+ypos+",left="+xpos+""); 
    	NewWindow.document.write ("<html><head><title>");
    	NewWindow.document.write (title);
    	NewWindow.document.write ("</title></head>");
      NewWindow.document.write ("<body bgcolor='#000000' onload='focus()'>");
    
      NewWindow.document.write ("<A HREF='javascript:close()'>");
      NewWindow.document.write ("<img src='");
    	NewWindow.document.write (picture);
    	NewWindow.document.write ("' alt='Click to close!' border ='0'");
    	NewWindow.document.write (" width='");
    	NewWindow.document.write (width);
    	NewWindow.document.write ("' height='");
    	NewWindow.document.write (height);
    	NewWindow.document.write ("'");
    	NewWindow.document.write (">");
      NewWindow.document.write ("</body></html>");
    
    	NewWindow.document.close();
      NewWindow.resizeTo(xsize,ysize); 
    }
    
     // end hiding from old browsers -->
    

    Seltsamerweise scheint das mit dem "alt" Tag nicht zu funktionieren und ausserdem erscheinen immer noch Scrollbalken



  • Ups,
    Letzte Zeile muss

    NewWindow.resizeTo(width,height);
    

    heissen


Anmelden zum Antworten