Rollover images in cart

[Nick]

Hi all

Does anyone know if it is possible to create rollover images for the "add to cart" button, "view cart", "update", "continue shopping" and "checkout" buttons?

Cheers
Nick

[I-CC]

Yup, sure is.

Here is one we did earlier.

#########
<TABLE BORDER="0" CELLPADDING=0 CELLSPACING="0">
<TR>
<TD align="center">
<Actinic:REMOVE TAG="UpdateButton">
<!-- <INPUT TYPE="SUBMIT" NAME="ACTION" VALUE="NETQUOTEVAR:UPDATEBUTTON"> -->
<INPUT TYPE="IMAGE" NAME="ACTION_UPDATE" SRC="update_button1.gif" ONMOUSEOVER="src='update_button2.gif'" ONMOUSEOUT="src='update_button1.gif'" ALT="Update your totals after making changes to the quantities">
</Actinic:REMOVE>
<Actinic:REMOVE TAG="UpdateButtonDisabled">
<!-- <INPUT TYPE="SUBMIT" NAME="ACTION" VALUE="NETQUOTEVAR:UPDATEBUTTON" DISABLED> -->
<INPUT TYPE="IMAGE" NAME="ACTION_UPDATE" SRC="update_button3.gif" ALT="Nothing to update" DISABLED>
</Actinic:REMOVE>
</TD>
<Actinic:REMOVE TAG="ShoppingList">
<TD align="center">
<Actinic:REMOVE TAG="SaveButton">
<!-- <INPUT TYPE="SUBMIT" NAME="ACTION" VALUE="NETQUOTEVAR:SAVEBUTTON"> -->
<INPUT TYPE="IMAGE" NAME="ACTION_SAVE" SRC="save_button1.gif" ONMOUSEOVER="src='save_button2.gif'" ONMOUSEOUT="src='save_button1.gif'" ALT="Save the content of your shopping cart for future use">
</Actinic:REMOVE>
<Actinic:REMOVE TAG="SaveButtonDisabled">
<!-- <INPUT TYPE="SUBMIT" NAME="ACTION" VALUE="NETQUOTEVAR:SAVEBUTTON" DISABLED> -->
<INPUT TYPE="IMAGE" NAME="ACTION_SAVE" SRC="save_button3.gif" ALT="Nothing to save" DISABLED>
</Actinic:REMOVE>
</TD><TD align="center">
<Actinic:REMOVE TAG="RestoreButton">
<!-- <INPUT TYPE="SUBMIT" NAME="ACTION" VALUE="NETQUOTEVAR:RESTOREBUTTON"> -->
<INPUT TYPE="IMAGE" NAME="ACTION_GET" SRC="retrieve_button1.gif" ONMOUSEOVER="src='retrieve_button2.gif'" ONMOUSEOUT="src='retrieve_button1.gif'" ALT="Restore the content of your shopping cart from a previous visit">
</Actinic:REMOVE>
<Actinic:REMOVE TAG="RestoreButtonDisabled">
<!-- <INPUT TYPE="SUBMIT" NAME="ACTION" VALUE="NETQUOTEVAR:RESTOREBUTTON" DISABLED> -->
<INPUT TYPE="IMAGE" NAME="ACTION_GET" SRC="retrieve_button3.gif" ALT="You do not have a retrievable cart" DISABLED>
</Actinic:REMOVE>
</TD>
</Actinic:REMOVE>
<TD align="center">
<Actinic:REMOVE TAG="ContinueButton">
<!-- <INPUT TYPE="SUBMIT" NAME="ACTION" VALUE="NETQUOTEVAR:CONTINUEBUTTON"> -->
<INPUT TYPE="IMAGE" NAME="ACTION_CONTINUE" SRC="continue_button1.gif" ONMOUSEOVER="src='continue_button2.gif'" ONMOUSEOUT="src='continue_button1.gif'" ALT="Continue with your shopping">
</Actinic:REMOVE>
<Actinic:REMOVE TAG="ContinueButtonDisabled">
<!-- <INPUT TYPE="SUBMIT" NAME="ACTION" VALUE="NETQUOTEVAR:CONTINUEBUTTON" DISABLED>-->
<INPUT TYPE="IMAGE" NAME="ACTION_CONTINUE" SRC="continue_button3.gif" ALT="You can not currently continue with your shopping, please use the menus" DISABLED>
</Actinic:REMOVE>
</TD>
<TD align="center">
<Actinic:REMOVE TAG="CheckoutButton">
<!-- <INPUT TYPE="SUBMIT" NAME="ACTION" VALUE="NETQUOTEVAR:CHECKOUTBUTTON"> -->
<INPUT TYPE="IMAGE" NAME="ACTION_BUYNOW" SRC="checkout_button1.gif" ONMOUSEOVER="src='checkout_button2.gif'" ONMOUSEOUT="src='checkout_button1.gif'" ALT="Proceed to the checkout and purchase your shopping cart contents">
</Actinic:REMOVE>
<Actinic:REMOVE TAG="CheckoutButtonDisabled">
<!-- <INPUT TYPE="SUBMIT" NAME="ACTION" VALUE="NETQUOTEVAR:CHECKOUTBUTTON" DISABLED> -->
<INPUT TYPE="IMAGE" NAME="ACTION_BUYNOW" SRC="checkout_button3.gif" ALT="Nothing in your cart, so no need to checkout just yet" DISABLED>
</Actinic:REMOVE>
</TD>
</TR>
</TABLE>
#######

You will still need to ensure that images are pre-loaded etc, but hope it helps...

[Nick]

Many thanks, I'll give it a try.


Regards
Nick

[jacy]

Hi Techno,
I have already changed my images in the checkout pages to jpg's but would like to change them to rollovers. Is there much difference using a flash (.SWF) file rather than 2 gif images? Seeing the images i want to make into rollovers have already been changed from the actinic default could i just change the name/extension eg instead of continue.jpg could i just change it to continue.swf? (obviously changing the name/extension in the checkout template as well)

Cheers and Thanks,

Jacy

[I-CC]

Not as easy with Flash I am afraid.

Flash is normally programmed with its own HREF information, so you could not use this as you would not be able to put dynamic Actinic references into it at usage time.

You could try it by putting the flash into it, surrounded by the appropriate <A HREF="......"> flash.img </A> code, but not 100% certain it will take to be honest....

[jacy]

Thanks Techno,
I think I'll try gifs instead
So sorry to be so dense but what template does this go in? Is it ACT_cart_ images or something similar??

Cheers,

Mitch

[cdicken]

The code for the buttons is in Act_ShoppingCart.html.