Mfrhtyj

I want to add a hover image for my product.

So the first step :

1- i've create a new attribute with code named hover_image for all types of the products.

2- in php file catalog->product->list.phtml i've add onmouseover javascript function to image tag like below

onmouseover="this.src='<?php echo $this->helper('catalog/image')->init($_product, 'hover_image')->resize(500,659)?>'"

but it's not working any suggestions ?

here is working code you can try this

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

Load again

$product=Mage::getModel('catalog/product')->load($_product->getId());

Now try with new object

echo $this->helper('catalog/image')->init($_product, 'hover_image')->resize(500,659)

Here is a complete working code you can use, please remember to upload placeholder

 <a href="<?php echo $_product->getProductUrl() ?>" title="<?php echo $this->stripTags($this->getImageLabel($_product, 'small_image'), null, true) ?>" class="product-image">

    <?php $hoverImage = $this->helper('catalog/image')->init($_product, 'hover_image')->resize(300,470)->setQuality(100);

    if (strpos($hoverImage, 'place-holder') == false) { ?>

    <img id="product-collection-image-<?php echo $_product->getId(); ?>"

        src="<?php echo $this->helper('catalog/image')->init($_product, 'small_image')->resize(300,470)->setQuality(100); ?>"

        alt="<?php echo $this->stripTags($this->getImageLabel($_product, 'small_image'), null, true) ?>"

        onmouseover="this.src='<?php echo $this->helper('catalog/image')->init($_product, 'hover_image')->resize(300,470)->setQuality(100) ?>';"

        onmouseout="this.src='<?php echo $this->helper('catalog/image')->init($_product, 'small_image')->resize(300,470)->setQuality(100); ?>';"

    />





    <?php } else { ?>

    <img id="product-collection-image-<?php echo $_product->getId(); ?>"

    src="<?php echo $this->helper('catalog/image')->init($_product, 'small_image')->resize(300,470)->setQuality(100); ?>"

    alt="<?php echo $this->stripTags($this->getImageLabel($_product, 'small_image'), null, true) ?>"



    />        

    <?php } ?>

</a>

You can uplaod place holder via backend System > Configtration > Catlouge > product image placeholder