Kleine Gallery bzw. ähnliches mit Javascript !
lima-city → Forum → Die eigene Homepage → Homepage Allgemein
anschauen
archiv
aufwand
befehl
bild
code
dank
fenster
http
index
kleine familien
quelle
software
spiel
text
tip
url
vergessen
wichtigsten teil
-
Moin Moin,
habe eine kleine Familien Website. nu habe ich Bilder, eine Gallery an für sich ist momentan nicht notwendig.
Nu habe folgendes vor. Habe ein Großes Bild davon erstelle ich ein kleines, sozusagen als vorschaubuld.
Wenn man auf das kleine Klickt soll sich das in Groß und im Popup öffnen.
Nu das da Java script mit im spiel ist ist klar, aber wie realesiere ich es am besten ?
Lg
Dennis -
Diskutiere mit und stelle Fragen: Jetzt kostenlos anmelden!
lima-city: Gratis werbefreier Webspace für deine eigene Homepage
-
Sowas hier?
<img src="/URL-DES-BILDES" width="BREITE-IN-PIXEL" height="HÖHE-IN-PIXEL" onClick="window.open('URL-DES-BILDES','','menubar=no')">
oder mit Javascript:
<script type="text/javascript"> <!-- function OpenFoto(img){ foto= new Image(); foto.src=(img); ControlFoto(img); } function ControlFoto(img){ if((foto.width!=0)&&(foto.height!=0)){ ViewFoto(img); } else{ interval_a="ControlFoto('"+img+"')"; interval_b=setTimeout(interval_a,20); } } function ViewFoto(img){ width=foto.width+20; height=foto.height+24; try { if (output.closed == false) throw "offen"; } catch (e) { if (e=="offen") { output.close(); } } output=window.open("","output","left=40,top=40,width="+width+",height="+height+",location=no,toolbar=no,menubar=no,status=no,scrol lbars=no,resizable=no"); output.document.writeln("<html><head><title>..:: Foto ::..<\/title><\/head>"); output.document.writeln("<body bgcolor=\"white\" text=\"white\" link=\"white\" vlink=\"white\" alink=\"white\" leftmargin=\"0\" marginwidth=\"0\" topmargin=\"0\" marginheight=\"0\">"); output.document.writeln("<table border=\"0\" cellpadding=\"0\" cellspacing=\"0\" width=\"100%\" height=\"100%\">"); output.document.writeln("<tr><td width=\"100%\" height=\"100%\" align=\"left\" valign=\"top\"><p><a href=\"javascript:self.close()\"><img src=\""+img+"\" width=\""+foto.width+"\" height=\""+foto.height+"\" border=\"10\" alt=\"click here to close the window\"></a><\/p><\/td><\/tr>"); output.document.writeln("<\/table><\/body><\/html>"); output.focus(); } // --> </script>
Letzteres habe ich nicht getestet!
MfG
Beitrag zuletzt geändert: 22.2.2010 10:57:26 von mccole -
hallo sajude,
du könntest dir mal http://www.digitalia.be/software/slimbox anschauen. Das arbeitet mit JavaScript und zeigt das große Bild nach Klick aufs Vorschaubild im selben Fenster in einem Layer über der eigentlichen Seite eingeblendet.
gruß, djfun -
Achso, sorry den wichtigsten Teil habe ich vergessen!
Du machst das mit dem Befehl hier:
<A href="javascript:OpenFoto('pfad/bild.jpg')">Text oder Bild</A>
Wie gesagt, getestet habe ich es nicht!
Quelle:
http://www.webmasterbiz.de/archive/index.php/t-742.html
EDIT:
Ich habs mal noch für dich getestet:
http://mccole.lima-city.de/
Wenn man auf das Bild im Popup klickt, schliesst sich das Fenster wieder =)
Ich hoffe das hilft dir weiter!
Beitrag zuletzt geändert: 22.2.2010 12:50:39 von mccole -
Danke genau sowas habe ich gesucht :-)
-
Diskutiere mit und stelle Fragen: Jetzt kostenlos anmelden!
lima-city: Gratis werbefreier Webspace für deine eigene Homepage
