MODUL: Cloud Zoom als Alternative zu MagicZoom

[infamous]

Nun habe ich es an einem anderen PC getestet und, ich werde verrückt, dort funktioniert es auch im IE7 und IE8. Liegt also offenbar an irgendwelchen Einstellungen an meinem PC...

[Tomcraft]

Hast du Kaspersky Antivirus auf dem "Problem PC"?

Grüße

Torsten

[infamous]

Ich benutze COMODO - deaktivieren hilft aber leider nichts.

Ich habe zwischenzeitlich weiter rumprobiert und eine neue Seltsamkeit entdeckt: Wenn ich den IE starte und die Produktseite direkt aufrufe, funktioniert es. Aber wehe, ich klicke F5 oder rufe die Seite über die Navigation neu auf - dann spinnt der Zoom wieder (konkret ist die Linse dann fast so groß wie das Vorschaubild und man sieht nur einen sehr kleinen Ausschnitt des großen Bildes), bis ich den Browser das nächste mal neu starte.

Das macht überhaupt keinen Sinn... am besten, ich schlafe erst mal eine Nacht darüber und schaue morgen nochmal. Ansonsten vertraue ich einfach darauf, dass das Problem wirklich nur bei mir auftritt und verdränge es einfach.

[thomas673]

Hallo,
ich habe ebenfalls Cloud Zoom bei mir installiert und habe nun eine Frage

Wie kann ich die Größe des rechten Zoom-Fensters verändern? Mit "zoomWidth: 120, zoomHeight:120" werden bei mir beide Rahmen zum suchen/zoomen verkleinert.

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

Ich verwende das Template "product_info_tabs".

Viele Grüße
Thomas

[Tomcraft]

Ich habe den verdacht, dass dein "original_image" nicht hochauflösend genug ist! Daher wird der Ausschnitt auch nicht vergrößert!

Hast du mal einen Link zu deinem Shop?

Grüße

Torsten

[thomas673]

Hallo Torsten,

vielen Dank für deine Antwort
Am Original Image liegt es nicht, das Bild hat eine Größe von 800 x 600 Pixel bei 300dpi.
Einen Link kann ich dir leider nicht schicken, weil der Shop noch nicht online ist.

Viele Grüße
Thomas

[Tomcraft]

[...]
Einen Link kann ich dir leider nicht schicken, weil der Shop noch nicht online ist.
[...]

Macht ja nichts... dann kann ich eben nicht weiter helfen und klinke mich jetzt hier aus.

Viel Erfolg!

Grüße

Torsten

[DefCon2k]

Servus,

die Werte "zoomWidth" und "zoomHeight" sind schon die richtigen, du kannst die Größe allerdings nicht unabhängig voneinander ändern.
Wenn du ein größeres Originalbild verwendest, wird der Rahmen über dem Bild automatisch kleiner (das angezeigte Artikelbild wird ja durch die "stylesheet.css" verkleinert dargestellt, es wird hier nicht die volle Bildgröße angezeigt, Cloud Zoom allerdings nutzt zur Darstellung das Originalbild).
Ich hoffe, ich habe mich einigermaßen verständlich ausgedrückt.

Gruß Tobi

[thomas673]

Hallo Tobi,

vielen Dank für deine Antwort. Das Problem habe ich nun behoben, es lag an den verschiedenen Größen des Produktbilds. Das Originalbild, Popupbild, Infobild, Bildgröße in der CSS und im Javascript waren unterschiedlich groß.
Gruß Thomas

[merkaba]

Ich mal wieder.

Trotz der Anleitung und dem erfolgreichen Installationsvorgang der files ändert sich leider nichts im Script.
Keine neue Funktion zu sehen:

http://awaken.eu/zoa/product_info.php?products_id=1

Der macht irgendwie kein Mouse-Over. Habe beide Seiten Caches gelöscht und die Seite neu geladen, leider ohne Erfolg.

Jemand eine Idee was ich falsch mache ?

[Tomcraft]

Bist du sicher, dass du die richtige "product_info_***.html" bearbeitet hast?

Bei dem Link wird die "product_info_x_accordion_v1.html" benutzt!

Grüße

Torsten

[insertinto]

Hi,

2 kleine Fragen zur Cloud Zoom Version von nicson:

Mein Template sieht so aus:

Code: PHP  [Auswählen]

<div class="red_theme_p_listing_product_image tr_float_left">
                {if $module_data.PRODUCTS_IMAGE}<img src="{$module_data.PRODUCTS_IMAGE|replace:"info_images":"original_images"}"
alt="{$module_data.PRODUCTS_NAME}" class="cloud-zoom cloud-zoom-gallery" id="zoom1" rel="adjustX: 10, adjustY:-4, zoomWidth: 200, zoomHeight:250" style="position: relative; display: block;"/>
<img src="{$module_data.PRODUCTS_IMAGE}" alt="{$module_data.PRODUCTS_NAME}" class="productimage" id="{$module_data.PRODUCTS_IMAGE|replace:"info_images":"original_images"}" />
{/if}
          </div>

Die Quellcodeausgabe zeigt mir, dass
a) das Bild nicht getauscht wird (2 Mal Thumbnail, beide werden angezeigt) und
b) es relative URLs sind.

nicson, Du hast absolute URLs in Deinem Code, ist das relevant? Und wie bekomme ich das Bild getauscht? Wahrscheinlich nur eine Kleinigkeit, aber ich bin recht neu dabei und finde es spontan nicht.

Der Quellcode (etwas suchmaschinenunfreundlicher ohne echte ALT-Attribut-Werte fürs Forum):

Code: PHP  [Auswählen]

<div class="red_theme_p_listing_product_image tr_float_left">
                <img src="images/product_images/thumbnail_images/9_0.jpg"
alt="ALTTEXT" class="cloud-zoom cloud-zoom-gallery" id="zoom1" rel="adjustX: 10, adjustY:-4, zoomWidth: 200, zoomHeight:250" style="position: relative; display: block;"/>
<img src="images/product_images/thumbnail_images/9_0.jpg" alt="ALTTEXT" class="productimage" id="images/product_images/thumbnail_images/9_0.jpg" />

 
          </div>

Ist noch nicht Live zu sehen, da es sich um einen Bastelshop auf localhost handelt.

Hat irgendwer entweder einen Hinweis, wo ich die Informationen finde, die mir weiterhelfen oder ganz einfach einen Lösungsansatz?

Viele Grüße, Ines

[insertinto]

Absolute URLs scheinen irrelevant zu sein, der Template-Code hat auch noch Fehler, hier die bessere Version, die zumindest keine Cloud Zoom Fehler produziert:

Code: PHP  [Auswählen]

        {if $module_data.PRODUCTS_IMAGE}<a href="{$module_data.PRODUCTS_IMAGE|replace:"info_images":"original_images"}"
alt="{$module_data.PRODUCTS_NAME}" class="cloud-zoom cloud-zoom-gallery" id="zoom1" rel="adjustX: 10, adjustY:-4, zoomWidth: 200, zoomHeight:250" style="position: relative; display: block;"/>
<img src="{$module_data.PRODUCTS_IMAGE}" alt="{$module_data.PRODUCTS_NAME}" class="productimage" id="{$module_data.PRODUCTS_IMAGE|replace:"info_images":"original_images"}" /> </a>

{/if}

Bleibt noch die Frage, wie komme ich im Listing an das Originalbild oder das Popup-Bild ran.
Sollte ich eine Lösung finden, bevor mich irgendwer in die richtige Richtung stupst, wo ich Dokumentation dazu finde, werde ich die selbstverständlich hier reinposten.

Grüße, Ines

[insertinto]

Tausche "info_images" durch "thumbnail_images"...

Code: PHP  [Auswählen]

{if $module_data.PRODUCTS_IMAGE}<a href="{$module_data.PRODUCTS_IMAGE|replace:"thumbnail_images":"original_images"}"
alt="{$module_data.PRODUCTS_NAME}" class="cloud-zoom cloud-zoom-gallery" id="zoom1" rel="adjustX: 10, adjustY:-4, zoomWidth: 200, zoomHeight:250" style="position: relative; display: block;"/>
<img src="{$module_data.PRODUCTS_IMAGE}" alt="{$module_data.PRODUCTS_NAME}" class="productimage" id="{$module_data.PRODUCTS_IMAGE|replace:"info_images":"original_images"}" /> </a>
{/if}

Nun geht's auch.

Grüße, Ines

[robertko]

Hi.
Ich hatte mir die Version von DefCon2k heruntergeladen, alles so gemacht wie es in der Anleitung stand und alles hat super funktioniert. allerdings, hätte ich den Zoom Effekt gern im "product_listing" und nicht in der "product_info".
Wie mache ich das, was muss ich ändern? Ich habe schon etwas ausprobiert, aber das funktioniert nicht.

Ich habe folgendes geändert.

Ich habe in der "product_listing" dieses:

Code: PHP  [Auswählen]

<a href="{$module_data.PRODUCTS_LINK}"><img src="{$module_data.PRODUCTS_IMAGE}" align="top" alt="{$module_data.PRODUCTS_NAME}"/></a>

geändert in:

Code: PHP  [Auswählen]

<a href="{$module_data.PRODUCTS_IMAGE|replace:"info_images":"popup_images"}" class="cloud-zoom cloud-zoom-gallery" id="zoom1" rel="adjustX: 10,
                        adjustY:-4, zoomWidth: 350, zoomHeight:350" style="position: relative; display: block;"><img src="{$module_data.PRODUCTS_IMAGE}" alt=
                        "{$module_data.PRODUCTS_NAME}" class="productimage" /></a>

Nunja, ein Versuch war es Wert.

Kann mir jemand helfen?

[EDIT Tomcraft 28.12.2011: Beitrag an vorhandenes Modul-Thema angehängt.]