0

I am fairly new to jquery and javascript, but certain that I can use it to get the result I desire. I would like to have the background-image of the add to cart button change on click. From my research,on this site and others,I have come to the code pasted below;for which the html is only the snippet for the button, which I copied from the Magento Go store source. I feel I am close but I think that I am not "identifying?"(for lack of the proper term) the class of the button correctly. If I had access to the php templates I think I would have an easier time customizing but this is the route that was chosen. I appreciate any insight given.

<script>
    google.load("jquery", "1.9.1");
    google.setOnLoadCallback(function() {
        $('btn-cart').onClick function() {
           $(this).css('background-image', 'url(image2)');
        });
    });
</script>

<style>
    .btn-cart{
        background-image: url('image1');
        width: 100px;
        height: 100px;
    }
</style>
<html>
<body>
    <button type="button" title="Add to Cart" class="button btn-cart" onclick="setLocation('http://charmit.gostorego.com/checkout/cart/add/uenc/aHR0cDovL2NoYXJtaXQuZ29zdG9yZWdvLmNvbS9jaGFybXMuaHRtbA,,/product/366/')">
    <span><span>Add to Cart</span></span></button>
</body>
</html>
Zach Saucier
  • 24,871
  • 12
  • 85
  • 147
user3272830
  • 1
  • And you're sure the page doesn't reload when you add something to the cart in Magento? As a sidenote, there is no onClick method in jQuery, so that should throw an error in the console. – adeneo Feb 04 '14 at 22:18
  • ^^ in other words, replace `onClick` with just `click` and add some parenthesis – adeneo Feb 04 '14 at 22:19
  • Thanks for the quick reponse. That was a good point about the page reload, but after checking I did find a theme for Magento Enterprise that had a similar add to cart feature. Thanks – user3272830 Feb 04 '14 at 22:26

0 Answers0