MODUL: Bilderwechsel mit jQuery in der product_info.html

[Modulfux]

Wieder mal ein nettes kleines Gimmick nach dem Motto "die Webkiste spielt mit jQuery".

Zwei Dateien müssen gemäß der Anleitung geändert werden (keine Angst nur Templatedateien) und schon wechseln die zusätzlichen Produktbilder mit jQuery. Sobald das Bild gewechselt ist, kann man auch dieses an Stelle des ursprünglichen Produktbildes gewohnt mit der Thickbox vergrößern.

Viel Spaß mit dem Gimmick.

  [ Für Gäste sind keine Dateianhänge sichtbar ]



Linkback: https://www.modified-shop.org/forum/index.php?topic=8224.0

[h-h-h]

Hi Webkiste,
vielen Dank.
Cooles Addon dieser Bilderwechsel!

Gruß

h-h-h

[Tomcraft]

Wunderhübsch, vielen Dank!

Grüße

Torsten

[speedy]

Sehr schön vielen Dank, jetzt wäre die Kombination mit einem der Zoom-Module perfekt.
Die hatten ja alle so Ihre Macken oder Vor- und Nachteile.

[Modulfux]

Danke für die Blumen. Mach ich doch gerne, wer viel hat, kann eben auch schonmal geben, oder?

[mantis]

ABER da du die Fancybox nutzt funzt dein Versandlink nicht mehr?

Gruss
mantis

[Modulfux]

@Mantis

Daher habe ich betont, dass eine Kundenprojekt-Baustelle ist. Der Shop liegt ja auch noch auf meiner Entwicklungsumgebung.

[gar85]

Bei mir funktioniert der Versandkosten-Link auch mit der Änderung.

Jetzt fehlt nur noch die Kopplung mit den Attributen. Das also bei der Auswahl eines Attributes das entsprechende Bild gewechselt wird. Statt mouseover.

Als einfachste Lösung könnte ich mir eine Matrix vorstellen, in der z.B. die Bilder (more pics)als Bild 1 bis 20 zugeordnet werden und Attribut 1 dann den Wert ´Bild 1 bekommt usw. Also unabhängig von den eigentlichen Werten eine relative Zuordnung. Hat zwar auch seine Nachteile, z.B. beim Bildwechsel, wäre aber doch zumindest ein Anfang.

Gruß
Klaus

[gar85]

Ich habe noch eine Idee dazu, weiß aber nicht ob oder wie sie umzusetzen ist:

Ausgehend von der Lösung von webkiste fehlt im Prinzip nur noch eine Änderung des Attributwertes. Hier stehen ID, Wert und Attribut-Artikelnummer(AAN) zur Verfügung. ID ist recht schwierig zuzuordnen, also besser Wert oder AAN. Voraussetzung für meine Idee ist, dass das Bild die Bezeichnung Artikelnummer_AAN_Z.jpg hat und AAN eindeutig ist. Die Artikelnummer (AN) ist bekannt, AAN ist bekannt und Z ist eine Variable, wenn mehrere Bilder zu einer AN vorhanden sind. Hat das ausgewählte Bild nun den Dateinamen AN_AAN_1.jpg wird z.B. bei FARBE die AAN gesucht und der Wert im Dropdownmenu dargestellt.

Beispiel:

Farbe rot hat die AAN 100
Farbe blau hat die AAN 200
Artikel ist die 4711
von der Farbe rot gibt es eine Vorder- und eine Rückansicht

Dann werden die Bilder 4711_100_1.jpg., 4711_100_2.jpg und 4711_200_1.jpg hinterlegt.
Fahre ich mit dem Cursor über das Bild blau, dann wird das blaue Bild dargestellt (siehe Lösung von webkiste). Der Dateinamen wird wird zerlegt, für 200 der Wert "blau" von den Farbattributen gesucht und dargestellt.
Fährt der Cursor jetzt über das Bild rot(1), dann wird das rote Bild Vorderansicht angezeigt und aus der Dateibezeichnung die 100 extrahiert, der Wert aus den Farbattributen gelesen und "rot" angezeigt.
Bei der Rückansicht passiert dasselbe, weil nur die Farb-Artikelnummer extrahiert wird und der jeweilige Wert angezeigt wird.

Läßt sich sicherlich auch für mehr als ein Attribut ausbauen.

Auf diese Art und Weise hätte man zumindest einen Weg realisiert. Der zweite Teil wäre dann ausgehend vom Attributwert das richtige Bild finden.

 
Klaus

[gar85]

jetzt der Test jqzoom: der Bildwechsel ist ok, aber der Zoom zeigt das originäre Produktbild.

[speedy]

Im Testshop von Webkiste nicht, wie du siehst.

[gar85]

Hi Speedy,

im Testshop ist kein Zoom installiert. Die Thickbox funktioniert auch bei mir, nur im Zusammenhand mit jqzoom gibt es die Probleme.

Klaus

[Ronja]

Hallöchen,

tolles Teil, dafür erstmal "DANKE".
Aber: Auch auf der Testseite funktioniert die Anzeige in der Vergrößerung nicht. Ist das noch keinem aufgefallen?
Wenn man z.B. mit der Maus über das blaue Bild geht und dann drauf klickt, erscheint die Galerie nicht richtig. Das orange Bild wird überhaupt nicht mehr angezeigt, das blaue dafür 2 mal.
Von der Sache her logisch, weil Thickbox oder auch Fancybox auf das Bild zugreifen, das gerade oben angezeigt wird.
Jedenfalls bringt das alles durcheinander.

Hat jemand eine Idee, wie das zu verhindern wäre?
Ich hatte mir überlegt, eventuell das Bild oben nur einzublenden, wenn man mit der Maus über dem unteren Bild ist, aber das ändert ja nix daran, das dann bei Klick die Bilder trotzdem falsch angesprochen werden.
Und irgendwie hab ich das Gefühl, das nicht richtig erklärt zu haben, aber vielleicht versteht es ja jemand und hat einen guten Gedanken dazu.

Danke und liebe Grüße
Ronja

[Modulfux]

Hallo Ronja,

also den von dir beschriebenen Fehler kann ich nicht nachvollziehen. Der Browser sollte hierbei keine Rolle spielen, da es sich um generierte Bildpfade handelt.

Wenn ich die Seite aufrufe und auf das eigentliche Produktbild klicke (orangefarbene Box) wird diese auch vergrößert. Gehe ich mit der Maus über die kleineren Bilder, so werden sie "oben" angezeigt und auch vergrößert.

Oder habe ich dich jetzt falsch verstanden?

Gruß
Ronny

[speedy]

Bei Webkiste funktionierte schon immer alles reibungslos auf der Seite, was diesen Bilderwechsel angeht. Ein Zoom wäre gut, aber das wurde ja auch nicht versprochen.