Buttons mit CSS Effekte ausstatten

[PeterPans]

Hallo,

seit längerem lese ich mit Aufmerksamkeit die Forenbeiträge und war auch immer stets bemüht die sich mir auftuenden Probleme zu lösen - doch diesmal find ich nicht so recht eine Lösung.

Ich würd gern, um das erfolgreiche Hinzufügen eines Artikel zum Warenkorb, gerne den
"In den Warenkorb" Button insofern abändern, als das er sich verändert wenn man ihn anklickt.
Wobei dies vllt. auch gar nicht die beste Möglichkeit ist, diese Problematik zu umgehen? Ich finde es ungeschickt, den Kunden aus der Produktansicht zu kicken nachdem er einen Artikel in den Korb tun will, daher habe ich diese Umleitung ausgeschaltet.
Nun besteht allerdings noch die Gefahr, dass der Kunde nicht bemerkt, dass er durch das Klicken tatsächlich den Artikel erfolgreich hinzugefügt hat.. also würd ich dies gern visualisieren.. Der Warenkorb is immer Sichtbar oben im Header - als Information anbei..

Also Entweder das Klicken visualisieren dachte ich mir oder vllt. sogar den Warenkorb mal aufblenden lassen? Aber natürlich nach möglichkeit mit CSS, da ja nicht jeder Kunde JavaScript anhat.. Was meint ihr?

Vielen dank für das Lesen und kommende Antworten,



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

[DokuMan]

Sowas in der Richtung? Popcart Version 1.01

oder sowas: Ajax Add Cart

[Tomcraft]

Vielleicht ist das Modul PopCart für dich die Lösung? Das bleibt der Kunde beim Artikel und der Warenkorb öffnet sich nur als Popup.

Hier wirst du fündig: TEMPLATE: xtc5 - Template für Modul Popcart v 1.01

Nachtrag: Mist... da war der DokuMan schneller.

Grüße

Torsten

[Markus]

Hi ...

also ich bin mittlerweile dazu übergegangen den Bestellen Button einfach ein wenig zu vergrößern und evtl. noch ein animiertes GIF daraus zu machen.

Bei den heutigen Internetverbindungen sollte das auch kein Problem sein wenn ein solcher Button dann mal 10 KB hat

Markus

[PeterPans]

Hallo,

vielen Dank für die schnellen Antworten!

Das "Ajax-add-cart" habe ich bereits ausprobiert, doch leider verschob sich dann der Warenkorb wenn ich ihn via CSS bereits woanders platziert hatte und es lief bei mir lediglich, wenn ich den standardmäßigen Warenkorb verwende. Ich verwende allerdings im Moment den "reduzierten Warenkorb" , das habe ich aus einen der Topics hier entnommen..

Das andere Programm werde ich mir gleich mal genauer anschauen und hoffe, dass es besser funktioniert

PS: Ich habe mir die Funktion "

Code: PHP  [Auswählen]

$info_smarty->assign('ADD_CART_BUTTON', xtc_image_submit('button_in_cart.gif',IMAGE_BUTTON_IN_CART));

" aus "includes/modules/product_info.php" nachzuvollziehen um nach dem Muster dann dem ganzen eine ID geben zu können, um es via CSS ansteuern zu können, bekam es aber nicht hin.. Woanders fand ich folgende Funktion:

Code: PHP  [Auswählen]

$info_smarty->assign('ADD_CART_BUTTON', xtc_image_submit('btn_indenwarenkorb.gif', IMAGE_BUTTON_IN_CART, 'onmouseover="this.src=\'btn_mover_indenwarenkorb.gif\'"
onmouseout="this.src=\'btn_indenwarenkorb.gif\'"'));

Diese ist allerdings mit Javascript, also nicht ganz das, was ich suchte anfangs.. mal ganz davon abgesehen, dass ich trotz dem ändern der Bilder es nicht hinbekam. Vllt. müssen die Pfade auch absolut angegeben sein, habe es nicht weiter getestet..

Also um wieder zurück zum Thema zu kommen, ich test den Popcart gleich mal. Es mit layern zu visualiseren hatte ich auch überlegt, allerdings nach dem Betätigen der Suchmaschinen erstmal wieder zur Seite gelegt^^

Lg,

NACHTRAG:
Super, das Popcart Tool funktioniert bisher tadelos Klasse, danke für den Tipp!

[PeterPans]

So, ich wußte doch, dass das nen Haken haben muss *g

Ist wie vermutet leider nur aktiv wenn der Nutzer Javascript aktiviert hat..
Aber okay, abstriche gibts immer..

Kann mir denn vielleicht jemanden sagen, wie ich das mit den Hover Effekt für die Buttons realisieren kann?

Lg

[jannemann]

hi,

wenn du mal bei google nach "css hover" suchst, dann findest du bestimmt ne menge turotials. du kannst dir dann ja zwei buttons erstellen. der zweite wird dann nur aktiv, wenn jemand mit der maus auf den button klickt. allerdings finde ich, dass das keine gute idee ist. ich würde dann eher den animierten button vorziehen.

schöne grüße,
jan

[PeterPans]

Den animierten Button? Das soll heißen? Kann mir darunter grad nichts vorstellen

Ja, ich weiß auch wie das im CSS funktioniert.. ich weiß nur nich, wie ich dem Button eine ID zuweisen kann. Wenn du mir das verraten kannst, komm ich alleine weiter..

Lg

[Markus]

Hi ...

du kannst dem Button "HTML"-Parameter mitgeben ...

Code: PHP  [Auswählen]

$box_smarty->assign('BUTTON_SUBMIT', xtc_image_submit('button_quick_find.gif', IMAGE_BUTTON_SEARCH, 'class="headsearchbutton"'));

So klar wie es funktioniert?
Das ist jetzt mal das Beispiel mit dem Suchen-Button.

Markus

[PeterPans]

Super danke

[PeterPans]

Hallo,

habe zunächst versucht im CSS dem Button durch das zuweisen von

Code: CSS  [Auswählen]

.CLASS:Hover{
background...Datei.gif
}

zu animieren.. ging aber leider nicht. Der zweite Versuch wäre dieser

Code: PHP  [Auswählen]

$info_smarty->assign('ADD_CART_BUTTON', xtc_image_submit('button_in_cart.gif', IMAGE_BUTTON_IN_CART,'JavaScript:onclick="/buttons/german/button_in_cart2.gif"'));

Mag aber auch nicht.. Wenn ich

Code: PHP  [Auswählen]

xtc_image_submit('button_in_cart.gif'

in

Code: PHP  [Auswählen]

xtc_image_submit('button_in_cart2.gif'

änder, wird die Animation allerdings angezeigt.. aber im Umkehrschluss geht leider

Code: PHP  [Auswählen]

$info_smarty->assign('ADD_CART_BUTTON', xtc_image_submit('button_in_cart.gif', IMAGE_BUTTON_IN_CART,'JavaScript:onclick=xtc_image_submit('button_in_cart2.gif)'));

auch nicht.. auch durch das Weglassen von 'JavaScript:' verändert sich nichts an der Sache.. also ich hab's in der Tat versucht, aber nicht wirklich hinbekommen!

Wie muss ich es machen?

[peterpan19]

Hallo, diese Thema interessiert mich auch, aber es scheint wohl noch keine endgültige Lösung zu geben. 
Ich möchte auch Buttons ändern, wenn ich mit der Maus darüber fahre bzw. drauf stehe. Anfangen wollte ich mit dem "button_buy-now.gif", der in der "product_listing" und in den Produkt Details angezeigt wird. Dazu habe ich einen 2. Button angelegt, der erscheinen soll, am liebsten über CSS, nicht mit Java. Funktioniert leider nicht, der Button wird zwar nach dieser Lösung hier im Thema angezeigt, verschwindet dann aber ganz.  Kann das jemand noch mal angehen bitte?
Danke und Gruß

[peterpan19]

Ich möchte diese Thema noch mal etwas "schieben", weil ich und sicher auch viele andere der Meinung sind, dass dies eine schicke nette Funktion ist. Ich habe seit 2 Tagen nichts anderes versucht, als diese Funktion hinzubekommen, leider ohne Erfolg. Vielleicht hat ja jemand Interesse, dies als JOB zu machen, ich stelle mal ein Angebot rein...
Gruß

[hedon02]

Dieses Modul funktioniert absolut wunderbar: BETA MODUL: Neue Button Funktion (Smartbuttons)

[peterpan19]

DANKE 
Werd es heute abend direkt ausprobieren, Rückmeldung kommt...