|
|
|
|
#1
02.07.12, 15:16
|
||||
|
||||
|
Bildergalerie per Image Map verlinken mit Pop Up zum großen Bild
Hi ihr Lieben,
ich bin gerade an den Vorbereitungen für eine Webseite. Bilder die in die Galerie sollen sind schon ein wenig nachbearbeitet. Ich habe in Photoshop über eine Aktion ein grosses Bild erstellt. Auf dieses Bild wurden dann in jede Reihe vier Bildthumbs eingefügt Darunter wieder vier... Ich wollte beim Einfügen in die Webseite aber das grosse Bild auf dem die Thumbs liegen, nicht zerschnippeln um jedes Thumbnail einzeln in der Webseite einzufügen. Also hab ich es so vor das ich über Image Maps Verweise auf jedes Thumbnail setze damit man es anklicken kann. Soweit dürfte das hoffentlich kein Problem werden Aber ist es auch möglich, das ich beim anklicken des Thumbnails ein Fenster bekomme in dem mein großes Bild angezeigt wird, z.b. in einer Grösse von 600x450px? Ich hab eine Möglichkeit gefunden das so zu machen das sich ein Pop Up Fenster öffnet. Aber irgendwie sagt mir das nicht zu. Ich hätte es lieber ähnlich wie es von einer Lightbox kennt. Ich würde mir so eine Lightbox ja auch machen aber ich hab keine Ahnung von Javascript und die Anleitungen die ich gefunden habe um eine Lightbox zu erstellen, sind alle in Englisch. Also verstanden hab ich da so garnix. Hat das denn schon mal jemand von Euch gemacht via Image Map? Ansonsten wäre auch noch die Möglichkeit eine Galerie mit Simple Viewer zu machen, aber ich dachte halt ich schaff es das Ganze selbst zu schreiben. LG Christin Geändert von Spatzihasi (02.07.12 um 15:26 Uhr). 
|
|
#2
03.07.12, 20:18
|
||||
|
||||
|
Hat sich erstmal erledigt. Ich machs mit flash
|
|
#3
03.07.12, 20:26
|
||||
|
||||
|
Hallo!
Mit Flash schließt du aber Ei-Päds und Ei-Föhns aus... Als LightBox kann ich dir PrettyPhoto empfehlen: http://www.no-margin-for-errors.com/...ightbox-clone/ Die Seite ist zwar auch englisch, aber dennoch recht gut dokumentiert. Hier sogar ein Tutorial bzgl. image map: http://www.no-margin-for-errors.com/...-an-image-map/
__________________
Gruß Jenny _____________________ Live long and prosper!
|
|
#4
04.07.12, 17:28
|
||||
|
||||
|
Hallo Jenny,
danke für die Links das muss ich mir mal genauer angucken aber stimmt es das die Lightbox auch Flash dabei hat? Hat jedenfalls eine erzählt die die mal bei jemandem eingebaut hat. Ich muss gucken ob ich das mit dem Englisch auf die Reihe krieg. Und wegen den Iphones und I Pads... meinste wirklich es sucht jemand ein Kosmetikstudio übers Ipad oder Iphone. Ich denke schon das die Leute da an den PC gehen. ich hab ja auch ein kleines Flashintro. Das hat zur Seite ganz gut gepasst. LG Christin
|
|
#5
04.07.12, 17:32
|
||||
|
||||
|
Hallo!
Was meinst du mit "auch Flash dabei hat"? Ob sie auch Flash wiedergeben kann? Ja, kann sie. Oder ob sie in ActionScript geschrieben ist? Nein, ist sie nicht.
__________________
Gruß Jenny _____________________ Live long and prosper!
|
|
#6
04.07.12, 20:17
|
||||
|
||||
|
Hallo
Ich meinte das ich davon ausgegangen bin das sie entweder flash enthält also nich komplett mit Javascript geschrieben ist oder eben ganz mit flash. Aber wenn du sagst das ist sie nicht dann war das dann eine falsche Info LG Christin
|
|
#7
11.07.12, 21:07
|
||||
|
||||
|
Hallo ihr Lieben,
ich hab mich jetzt dafür entschieden die Lightbox 2 zu nehmen Version 2.51. Bei den Bildern ist es jetzt so das ich für die Thumbs z.b. die Bildbezeichnungen Thumb1, Thumb2, Thumb3, Thumb4 usw. habe Bei den großen Bildern z.b. image1, image2, image3, image4 Wenn ich das nicht nummeriere mit 1 bis 4 usw. wird immer das letzte Bild angezeigt egal auf welches Thumb ich klicke In der Webseite hab ich Bilder von Maskenbildnerei, Schmuck und Studio. Kann mir mal jemand von euch bitte eine Meinung sagen wie ich das am günstigsten benenne? Image 1 bis XX ist mir zu unaussagekräftig. Aber ich befürchte wenn ich zum Beispiel schreibe Masken1,2,3 usw für Maskenbildnereibilder dann Schmuck4, Schmuck 5, Schmuck6 für Schmuckbilder und Studio7, Studio8, Studio9 für Studiobilder dann geht das in der Lightbox sicher wieder durcheinander. Wie habt ihr das denn gemacht wenn ihr viele Bilder zu verschiedenen Theman habt? ******************************************* Das ist der Code von meiner HTML Galerie Seite (im Moment noch ganz ohne Formatierung via CSS, ich habs nur auf Funktionalität getestet): <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd"> <html xmlns="http://www.w3.org/1999/xhtml" lang="de"> <head> <title>Lightbox JS v2.0 | Test Seite</title> <script src="js/jquery-1.7.2.min.js"></script> <script src="js/lightbox.js"></script> <link href="css/lightbox.css" rel="stylesheet" /> </head> <body> <a href="images/examples/testimage1.jpg" rel="lightbox[plants]" title="Nummer1."><img src="images/examples/mythumb1.jpg" alt="Plants: image 1 0f 4 thumb" /></a> <a href="images/examples/testimage2.jpg" rel="lightbox[plants]" title="Nummer2."><img src="images/examples/mythumb2.jpg" alt="Plants: image 2 0f 4 thumb" /></a> <a href="images/examples/testimage3.jpg" rel="lightbox[plants]" title="Nummer3."><img src="images/examples/mythumb3.jpg" alt="Plants: image 3 0f 4 thumb" /></a> <a href="images/examples/testimage4.jpg" rel="lightbox[plants]" title="Nummer4."><img src="images/examples/mythumb4.jpg" alt="Plants: image 4 0f 4 thumb" /></a> </body> </html> LG Christin
|
|
#8
11.07.12, 21:15
|
||||
|
||||
|
Hallo!
Eigentlich sollte es der LightBox völlig egal sein, wie die Thumbs und die Bilder heißen, solange sie alle korrekt verlinkt sind. Gib uns doch mal die URL, so dass man sich den Code anschauen kann! (Ah, den hast du ja schon ergänzt!)
__________________
Gruß Jenny _____________________ Live long and prosper!
|
|
#9
11.07.12, 21:36
|
||||
|
||||
|
Also, ich habe das eben mal nachgebaut und bei mir funktioniert es auch mit sprechenden Dateinamen genau so wie es soll!
Die Bilder heißen bei mir Klaus.jpg, Sabine.jpg, ... Die Thumbs heißen bei mir Klaus_th.jpg, Sabine_th.jpg, ...
__________________
Gruß Jenny _____________________ Live long and prosper!
|
|
#10
12.07.12, 10:23
|
||||
|
||||
|
Ich teste das nochmal und dann meld ich mich nochmal
LG Christin
|
 |
| Lesezeichen |
| Aktive Benutzer in diesem Thema: 1 (Registrierte Benutzer: 0, Gäste: 1) | |
| Themen-Optionen | |
| Ansicht | |
|
|
Ähnliche Themen
|
||||
| Thema | Autor | Forum | Antworten | Letzter Beitrag |
 Upload für Bildergalerie
|
Thomas Noweski | Lounge | 6 | 24.05.11 16:43 |
| Von PSE8 auf den großen Bruder ;-) | M2121 | Installation, Konfiguration, Hardware und Software | 7 | 26.08.10 14:02 |
|
PSC verlinken
|
sham | Lounge | 12 | 18.03.10 20:50 |
| 4 Bilder mit Rahmen zu einem Großen | gone-insane | Hilfestellung, Tipps und Tricks | 3 | 10.01.09 13:48 |
 Hoffen auf den großen Wurf
|
blindguard | Lounge | 0 | 12.12.05 15:55 |
Bildergalerie per Image Map verlinken mit Pop Up zum großen Bild
Hybrid-Darstellung
