51可用代码模板网站

咨询热线:

181-1164-6936
  • 1
ECSHOP商城
当前位置:首页>实用代码>ECSHOP商城>

ecshop实现鼠标滑过小图切换大图功能

时间:2017-08-10 14:50点击:
关于如何使ecshop网店里商品图片在能多现实的前提下又不影响客户查看呢?这就需要鼠标经过图片就能切换为大图的功能,具体如何操作呢?鼠标滑过小图显示大图的代码如下:
先打开goods.dwt

添加代码:


<script type="text/JavaScript">
function change_img(img_src)
{
document.getElementsByName("goods_img")[0].src=img_src;
}
</script>
在<head></head>之间。


然后找到代码:


<img src="{$goods.goods_img}" alt="{$goods.goods_name|escape:html}" > 
在"{$goods.goods_name|escape:html}"代码的后面加上:



name="goods_img" width="250" height="250"/>
最后打开goods_gallery.lbi

找到代码:



<!-- {foreach from=$pictures item=picture}-->
<li><a href="gallery.PHP?id={$id}&img={$picture.img_id}" target="_blank"><img src="{if $picture.thumb_url}{$picture.thumb_url}{else}
    {$picture.img_url}{/if}" alt="{$goods.goods_name}" class="B_blue" /></a>
</li>
<!--{/foreach}-->
在class="B_blue"后面加上:



onmouseOver="change_img(this.src)" />


51可用模板(代码)网站专为广大站长朋友提供精品模板与代码,同时免费提供网站收录。
本站域名: WWW.51KYDM.COM    联系方式:QQ:182468923    手机:18111646936
本站关键词:网站链接收录网址收录入口网站免费提交收录网站收录提交入口    网站地图
51可用模板
展开