Creating a Rollover for your Add to Cart Button

[Bob Isaac]

Has anyone got this tip from the adv users guide to work? I have tried 3 times now and nothing happens. The computer I am using at the moment only has IE7 so I have not tried it with other browsers, but I can't see that being the issue.

Bob

[Design2Please]

Yes this option works for me (although in preview mode it shows an image error when you mouse over), but it works fine on the site.

[Bob Isaac]

9. Now edit the code of the layout, and change it to look like the following:

Here's some code to copy and paste:
<input type="image"
src="<actinic:variable name="CartButtonImage" />"
name="_<actinic:variable name="ProductReference" />"
alt="Add to Cart"
onMouseOver="src='<actinic:variable name="AltCartButtonImage" />' "
onMouseOut="src='<actinic:variable name="CartButtonImage" />' "
/>

Did you do the above edit in one or both the instances in the layout code? I tried the first instance only and then both instances, but it still did not work.

Bob

[Design2Please]

I have just changed mine in the top part of the rollover add to cart layout so looks likes this:

<actinic:block if="%3cactinic%3avariable%20name%3d%22CartButtonVisibleToAllCustomers%22%20%2f%3e" >
<!-- This code is used when the cart button is visible to all customers -->
<input type="image"
src="<actinic:variable name="CartButtonImage" />"
name="_<actinic:variable name="ProductReference" />"
alt="Add to Cart"
onMouseOver="src='<actinic:variable name="AltCartButtonImage" />' "
onMouseOut="src='<actinic:variable name="CartButtonImage" />' "
/>

</actinic:block>

as opposed to my add to cart layout:

<actinic:block if="%3cactinic%3avariable%20name%3d%22CartButtonVisibleToAllCustomers%22%20%2f%3e" >
<!-- This code is used when the cart button is visible to all customers -->
<input type="image"
src="<actinic:variable name="CartButtonImage" />"
name="_<Actinic:Variable Name="ProductReference"/>"
alt="Add to Cart"
/>
</actinic:block>

Hope that is of some help to you.

Regards