Tuesday, 20 November 2012

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 onclick="popWin('&lt;?php echo $this-&gt;getGalleryUrl($_image) ?&gt;', 'gallery', 'width=300,height=300,left=50,top=50,location=no,status=yes,scrollbars=yes,resizable=yes'); return false;" href="#"> <!--nested img tag stays the same--></a>

 

Step 3. Replace searched code with code below.
<a title="&lt;?php echo $_product-&gt;getName();?&gt;" onmouseover="$('image').src = this.href; return false;" href="&lt;?php echo $this-&gt;helper('catalog/image')-&gt;init($this-&gt;getProduct(), 'image', $_image-&gt;getFile()); ?&gt;"> <img src="&lt;?php echo $this-&gt;helper('catalog/image')-&gt;init($this-&gt;getProduct(), 'thumbnail', $_image-&gt;getFile())-&gt;resize(56); ?&gt;" alt="&lt;?php echo $this-&gt;htmlEscape($_image-&gt;getLabel()) ?&gt;" width="56" height="56" /></a>

No comments:

Post a Comment