Magento change main image to any product picture on mouse over

Magento change main image to any product picture on mouse over Magento eCommerce Product image change on hover: mouseover: Magento have default feature that when u click on the product image it will get opened in new window so now you can show the product image into the main image on mouseover or on mouse

 click just search the code in app/design/frontend/default/yourtheme/catalog/product/view/media.phtml

<li><a href="#" onclick="popWin('<?php echo $this->getGalleryUrl($_image) ?>', 'gallery', 'width=300,height=300,left=0,top=0,location=no,status=yes,scrollbars=yes,resizable=yes'); return false;" title="<?php echo $this->htmlEscape($_image->getLabel()) ?>"><img src="<?php echo $this->helper('catalog/image')->init($this->getProduct(), 'thumbnail', $_image->getFile())->resize(56); ?>" width="56" height="56" alt="<?php echo $this->htmlEscape($_image->getLabel()) ?>" /></a></li>

and repalce with

<li><a href="<?php echo $this->helper('catalog/image')->init($this->getProduct(), 'image', $_image->getFile()); ?>" title="<?php echo $this->getName();?>" onmouseover="$('image').src = this.href; return false;" onclick="$('image').src = this.href; return false;"><img src="<?php echo $this->helper('catalog/image')->init($this->getProduct(), 'thumbnail', $_image->getFile())->resize(56); ?>" alt="<?php echo $this->htmlEscape($_image->getLabel()) ?>" title="<?php echo $this->htmlEscape($_image->getLabel()) ?>" /></a></li>

this will show the thumbnail image into the main image on mouse over and on mouse click