我们在开发magento的时候,经常会碰到产品图片切换的需求,在鼠标移动到产品图片上去之后,产品图片切换成另外一张。 下面我们一起来看以下代码:
<?php $x=200;$y=200;?>
<a href=”<?php echo $_product->getProductUrl() ?>” title=”<?php echo $this->stripTags($this->getImageLabel($_product, ‘small_image’), null, true) ?>”>
<img id=”product-collection-image-<?php echo $_product->getId(); ?>” src=”<?php echo $this->helper(‘catalog/image’)->init($_product, ‘small_image’)->constrainOnly(FALSE)->keepAspectRatio(TRUE)->keepFrame(FALSE)->resize($x,$y); ?>”
alt=”<?php echo $this->stripTags($this->getImageLabel($_product, ‘small_image’), null, true) ?>”
onmouseover=”this.src = ‘<?php echo $this->helper(‘catalog/image’)->init($_product, ‘thumbnail’)->constrainOnly(FALSE)->keepAspectRatio(TRUE)->keepFrame(FALSE)->resize($x,$y) ?>’;”
onmouseout=”this.src = ‘<?php echo $this->helper(‘catalog/image’)->init($_product, ‘small_image’)->constrainOnly(FALSE)->keepAspectRatio(TRUE)->keepFrame(FALSE)->resize($x,$y) ?>’;”
/>
</a>
除此之外,要想在鼠标移动上去之后,变换图片,还需要在网站后台产品图像里面修改产品的图片属性
/template/catalog/product/list.phtml