Showing posts with label magento on hover change product image in catalog.. Show all posts
Showing posts with label magento on hover change product image in catalog.. Show all posts

Friday 29 May 2015

magento on hover change product image in catalog.

Hello

I am One Issue. I am change image in product listing page. when i am hover the image it can be change image after mouse out then default image can be see.

I am Writing code for that you can check that can help you.

 <?php $defaultSelectedImage = basename($this->helper('catalog/image')->init($_product, 'small_image')->resize(215));?>
         
            <?php  $defaultSelectedImage_url = $this->helper('catalog/image')->init($_product, 'small_image')->resize(215);  ?>
                   <?php $_galleryImages = Mage::getModel('catalog/product')->load($_product->getId())->getMediaGalleryImages();
               
                        foreach($_galleryImages as $_gimages){
                            $gallerySelectedImage = basename($this->helper('catalog/image')->init($_product, 'small_image',$_gimages->getFile())->resize(215));
                       
                           if($defaultSelectedImage != $gallerySelectedImage){
                       
                     
                       
                       
                             $_hover_image = $this->helper('catalog/image')->init($_product, 'small_image',$_gimages->getFile())->resize(215);
                           
                             break;
                       
                     
                       
                         
                        }
                       
                        }
                    ?>  
<a href="<?php echo $_product->getProductUrl() ?>" title="<?php echo $this->stripTags($this->getImageLabel($_product, 'small_image'), null, true) ?>" class="product-image">
             

 <img onmouseover="this.src = '<?php echo $_hover_image; ?>';"  src="<?php echo $this->helper('catalog/image')->init($_product, 'small_image')->constrainOnly(FALSE)->keepAspectRatio(TRUE)->keepFrame(FALSE)->resize(215); ?>"
                onmouseout="this.src = '<?php echo $this->helper('catalog/image')->init($_product, 'small_image')->constrainOnly(FALSE)->keepAspectRatio(TRUE)->keepFrame(FALSE)->resize(215) ?>';"
                 alt="<?php echo $this->stripTags($this->getImageLabel($_product, 'small_image'), null, true) ?>" />
            </a>

check this code it can be Look Good.