oldbear Posted November 12, 2009 Report Share Posted November 12, 2009 hi, ich möchte gerne in die rechte untere Ecke beim Produkt-Bild eine "Lupe" einblenden. Hab schon gegoogelt, komm aber nicht wirklich klar. In der CSS ist der Eintrag für das Bild so: .imageThumb { float:left; width:146px; height:220px; background-repeat:no-repeat; background-position:center center; border: 1px solid #ffffff; background-color: #ffffff; } Wie müsste hier der Eintrag für die "lupe" sein ? Vielen Dank für Eure Hilfe vorab ! Grüsse Link to comment Share on other sites More sharing options...
GoriBoy Posted November 12, 2009 Report Share Posted November 12, 2009 Hallo oldbear, willst du das für dein konfigurator? bin auch am testen und möchte es in den bildern beim dropdown einbauen.. ich melde mich wenn es bei mir klappt. Gruß GoriBoy Link to comment Share on other sites More sharing options...
oldbear Posted November 12, 2009 Author Report Share Posted November 12, 2009 hi Gori, ne, eigentlich für die normalen Listings etc., weil der Kunde ja a priori nicht weiss, daß er aufs Bild klicken kann. Habs jetzt wenigstens so hingekriegt, dass rechts unten neben dem Bild die Lupe erscheint. Zum Konfigurator: Ist Dir ( oder anderen ) aufgefallen, daß der Fokus im Konfigurator auf der ganzen Zeile ( Gruppe, Artikel, Up/Down-Arrow ) liegt ? Mein Kunde hätte das gern auf den Up/Down-Arrow beschränkt. Nehme aber an, das liegt im Accordion vergraben und so nicht zu ändern ...( Anfrage bei BUI läuft ). Ausserdem hätte ich immer noch gerne einen anderen RADIO-Button, wahrscheinlich auch im jquery .. Wie kriegt man eigentlich eine "compressed" js wieder auf normal ? Würde gern an der jquery.Mtab.js von BUI was ändern. P.S.: Dein Warenkorb-Problem ist wohl gelöst ? Grüsse Link to comment Share on other sites More sharing options...
df:bug Posted November 12, 2009 Report Share Posted November 12, 2009 Hallo, wenn die Lupen-Grafik eine *.png-Grafik ist, kannst du die einfach mit "margin-left: -20px" drüber ziehen. Viele Grüße, df:bug Link to comment Share on other sites More sharing options...
dukie6666 Posted November 12, 2009 Report Share Posted November 12, 2009 oder lege es darüber mittels z-index Link to comment Share on other sites More sharing options...
NUD Posted November 12, 2009 Report Share Posted November 12, 2009 wie df:bug schon sagt, würde ich es auch so ähnlich machen machen. schreib im Template noch ein <span class="lupe"> </span> innerhalb von dem thumb hinter das img tag und Du kannst dort je nach größe des png's dieses fest über dem Bild plazieren: .imageThumb span { position:absolute; margin-left: 3px; margin-top: 3px; background-image: url(deine lupe.png); ... } oder <span class="lupe"><img src="deine lupe.png" alt="" /></span> Link to comment Share on other sites More sharing options...
oldbear Posted November 12, 2009 Author Report Share Posted November 12, 2009 hallo, das hat leider nicht geklappt, habe Lupe jetzt wenigstens neben dem Bild, geht auch so. In der Artikelansicht bin ich aber noch am kämpfen - wegen der Thickbox. Ich kriegs soweit hin, daß meine Lupe erscheint, nur geht dann nicht die Thickbox auf sondern wie mit "blank" eine neue Seite mit dem Bild - eigentlich gar nicht so schlecht ... Die Sache mit dem z-index von dukie6666 und die span-Geschichte von NUD muss ich halt ausprobieren. Als "alter" Cobol-Programmierer tu ich mich schon hart mit dem ganzen class/div/a/li - Gerümpel - immer ist "aussenrum" was .... Danke für die Tipps ! Grüsse Link to comment Share on other sites More sharing options...
NUD Posted November 13, 2009 Report Share Posted November 13, 2009 noch mal zur verdeutlichung, ich habe in der productlisting etwa folgendes: <div class="produktlisting_bild">{if $module_data.products_image!=''}<a href="{$module_data.products_link}">{img img=$module_data.products_image type=m_thumb class=productImageBorder alt=$module_data.products_name}</a>{/if}</div> daraus machst Du dann wie in meinem Beispiel folgendes: <div class="produktlisting_bild">{if $module_data.products_image!=''}<a href="{$module_data.products_link}">{img img=$module_data.products_image type=m_thumb class=productImageBorder alt=$module_data.products_name} <span class="lupe"> </span> </a>{/if}</div> und kannst dann mein css Beispiel anwenden, wenn Du dabei probleme hast kannst Du mich gerne anschreiben. Link to comment Share on other sites More sharing options...
ahlfy Posted November 13, 2009 Report Share Posted November 13, 2009 Doch oldbear ... das geht <img src="prdouktbild.jpg"><img style="margin-left:-20px;" src="lupe.png"> das klappt so gestern probiert Link to comment Share on other sites More sharing options...
oldbear Posted November 13, 2009 Author Report Share Posted November 13, 2009 hi ahlfy, bei meinem Template ( BUI ) wars etwas komplexer, hat jetzt aber funktioniert ( musste inline-CSS noch etwas erweitern ): <div class="imageThumb" style="background-image:url('{img img=$image type=m_thumb path_only=true}');"><img style="float:right; width:24px; height:26px; margin-top:190px;" src="{$tpl_path}/img/icons/lupe.png"> <a href="{$link}" title="{$title}">{img img=pixel_trans.gif type=t_img}</a> </div> geht jetzt wie gewünscht ( rechte untere Ecke vom Bild ) , nochmal vielen Dank ! Grüsse Link to comment Share on other sites More sharing options...
snipes Posted February 2, 2010 Report Share Posted February 2, 2010 Hallo, kann ich mir mal ansehen, wie das fertig rüber kommt ? ;. ( GR Link to comment Share on other sites More sharing options...
Recommended Posts
Archived
This topic is now archived and is closed to further replies.