Moin zusammen,
wir haben ziemlich viele Artikel in den jeweiligen Konfiguratorgruppen, was dazu führte, dass Kunden das Artikelbild der jeweils ausgewählten Komponente nicht mehr sehen konnten, da schon aus dem Bild gescrollt.
Darauf haben wird die Komponentendarstellung umgestellt. Sie werden nun horizontal in einem jcarousel dargestell, analog zu den Darstellungen in "Ähnliche Artikel" usw.
Grundsätzlich funktioniert das auch. Jedoch sehe ich Probleme bei mobilen Geräten wie Pads (iOS/Android) und Smartphones. Hier ist das Carousel entweder leer, oder es werden Artikelbilder übereinander dargestellt. Das Problem scheint auch relativ unabhängig vom verwendeten Browser zu sein. Auf einem S3 zeigen weder Chrome, noch der eingebaute Browser irgendetwas im Carousel an.
Bei PC basierenden Browsern hätte ich ja noch eine Idee, wie ich das trouble-shooten könnte. Aber bei Smartphones? Gibt's da auch sowas wie Firebug?
Hat irgendwer einen Tipp, wie/wo ich da ansetzen kann? Über Hinweise, die direkt zur Lösung führen, wäre ich natürlich auch dankbar.
Hier noch ein paar Bilder zur Veranschaulichung:
Beispielartikel: Kapuzen Badetuch 80x80
relevante Codeschnipsel:
wir haben ziemlich viele Artikel in den jeweiligen Konfiguratorgruppen, was dazu führte, dass Kunden das Artikelbild der jeweils ausgewählten Komponente nicht mehr sehen konnten, da schon aus dem Bild gescrollt.
Darauf haben wird die Komponentendarstellung umgestellt. Sie werden nun horizontal in einem jcarousel dargestell, analog zu den Darstellungen in "Ähnliche Artikel" usw.
Grundsätzlich funktioniert das auch. Jedoch sehe ich Probleme bei mobilen Geräten wie Pads (iOS/Android) und Smartphones. Hier ist das Carousel entweder leer, oder es werden Artikelbilder übereinander dargestellt. Das Problem scheint auch relativ unabhängig vom verwendeten Browser zu sein. Auf einem S3 zeigen weder Chrome, noch der eingebaute Browser irgendetwas im Carousel an.
Bei PC basierenden Browsern hätte ich ja noch eine Idee, wie ich das trouble-shooten könnte. Aber bei Smartphones? Gibt's da auch sowas wie Firebug?
Hat irgendwer einen Tipp, wie/wo ich da ansetzen kann? Über Hinweise, die direkt zur Lösung führen, wäre ich natürlich auch dankbar.
Hier noch ein paar Bilder zur Veranschaulichung:
Beispielartikel: Kapuzen Badetuch 80x80relevante Codeschnipsel:
Code:
{if isset($oArtikel_arr) && count($oArtikel_arr)>0}<div class="container {if !isset($bAutoload) || !$bAutoload}carousel_loader{/if} {if isset($cClass)}{$cClass}{/if}">
{assign var='random' value=1|rand:999999}
<h2>{if $headline}{$headline}{else}{lang key=$cKey section=$cSection}{/if}</h2>
<ul style="height: 180px;" id="{if isset($cID)}{$cID}{else}mycarousel{$random}{/if}" class="jcarousel-skin-tiny" ref="{if isset($nVisible) && $nVisible > 0}{$nVisible}{else}{if $Einstellungen.template.articledetails.article_jcarousel_visible}{$Einstellungen.template.articledetails.article_jcarousel_visible}{else}2{/if}{/if}">
{foreach from=$oGruppe->oItem_arr item=oItem name=konfigitem}
{assign var=oArtikel value=$oItem->getArtikel()}
<li style="width: 200px;">
<div class="article_wrapper">
<div class="item{if $aKonfigitemerror_arr[$kKonfigitem]} error{/if}">
<label for="item{$oItem->getKonfigitem()}" id="label{$oItem->getKonfigitem()}" class="{if $cBeschreibung|strlen > 0}config_tooltip{/if}{if $oItem->getEmpfohlen()} recommended{/if}" ref="tooltip{$oItem->getKonfigitem()}" style="clear: left; text-align: center;">
<span class="img"><img src="{$oArtikel->Bilder[0]->cPfadKlein}" class="image" height="100" alt="" /></span>
<input style="width: 130px;" type="{if $oGruppe->getAnzeigeTyp() == $KONFIG_ANZEIGE_TYP_CHECKBOX}checkbox{else}radio{/if}" name="item[{$oGruppe->getKonfiggruppe()}][]" id="item{$oItem->getKonfigitem()}" value="{$oItem->getKonfigitem()}" {if $oItem->getSelektiert() && !$aKonfigerror_arr}checked="checked"{/if} />
</br>
<p style="width: 140px;">
{if $oGruppe->getAnzeigeTyp() == $KONFIG_ANZEIGE_TYP_CHECKBOX}{$oItem->getInitial()}x {/if}{$oItem->getName()}
</p>
<span style="top: 105px;" class="price">
{if $oItem->hasRabatt() && $oItem->showRabatt()}<span class="discount">{$oItem->getRabattLocalized()} {lang key="discount"}</span>{elseif $oItem->hasZuschlag() && $oItem->showZuschlag()}<span class="additional">{$oItem->getZuschlagLocalized()} {lang key="additionalCharge"}</span>{/if}{$oItem->getPreisLocalized()}
</span>
</label>
{if $aKonfigitemerror_arr[$kKonfigitem]}<p class="box_error">{$aKonfigitemerror_arr[$kKonfigitem]}</p>{/if}
{if $cBeschreibung|strlen > 0}<div class="config_overlay" id="tooltip{$oItem->getKonfigitem()}">{$cBeschreibung}</div>{/if}
</div>
</div>
</li>
{/foreach}
</ul>
</div>
{/if}
