Tuesday, 28 June 2011

Magento Image Switcher On MouseOver

Step1. open file on location given below

app/design/frontend/default/default/template/catalog/product/view/media.phtml

Step2. Search the code in media.phtml file
<a href="#" onclick="popWin('<?php echo $this->getGalleryUrl($_image) ?>', 'gallery', 'width=300,height=300,left=50,top=50,location=no,status=yes,scrollbars=yes,resizable=yes'); return false;">
   <!--nested img tag stays the same-->
</a>

Step 3. Replace searched code with code below.

<a href="<?php echo $this->helper('catalog/image')->init($this->getProduct(), 'image', $_image->getFile()); ?>" title="<?php echo $_product->getName();?>" onmouseover="$('image').src = this.href; return false;">
   <!--nested img tag stays the same-->
</a>

6 comments:

  1. Nice, thank you ...

    ReplyDelete
  2. Thank you for the code. Any ideas to adapt a little code on my theme as this is working but no images showing in thumbnails?

    ReplyDelete
  3. Is this for product listing page ?

    Does it work like this,
    http://8theme.com/demo/blanco/apparel.html

    ReplyDelete
  4. Thank u so much.. But can we made it as carousel?

    ReplyDelete
  5. This code is not working,When i'm using a color switcher why?

    ReplyDelete