您现在的位置是：首页 > cms教程 > Ecshop商城教程Ecshop商城教程

ecshop商品相册鼠标移动滑过小缩略图显示大商品图片

郭俊立2024-03-30Ecshop商城教程已有人查阅

导读部分人ECSHOP模板商品页面商品相册缩略图小图要靠点击才会显示商品大图先打开goods.dwt在之间。然后找到代码：

部分人ECSHOP模板商品页面商品相册缩略图小图要靠点击才会显示商品大图先打开goods.dwt
添加代码:

<script type="text/javascript">
function change_img(img_src)
{
document.getElementsByName(“goods_img”)[0].src="/a/2406248/img_src;}
</script>

在<head></head>之间。
然后找到代码：
<img src="/a/2406248/{$goods.goods_img}" rel="nofollow"/>在”{$goods.goods_name|escape:html}”代码的后面加上：
name="goods_img"
最后打开goods_gallery.lbi
找到代码：

<!- {foreach from=$pictures item=picture}->
<li><a href="/a/2406248/gallery.php?id={$id}&img={$picture.img_id}" target="_blank" rel="nofollow"></li>
<!-{/foreach}->

在class="B_blue"后面加上：

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

保存，运行即可。
经过上面的测试，鼠标滑过小图，在上面的图片显示位置显示的还是小图，原因在于：onmouseOver=”change_img(this.src)”，这段代码的意思是在上面的图片显示区显示当前的图片地址，this.src，而当前的图片地址正好是小图，解决方法：
将上面提到的：

<img src="/a/2406248/{if" rel="nofollow"/>

修改为：

<img src="/a/2406248/{$picture.img_url}" rel="nofollow"/>

OK！

本文标签：

很赞哦！ ()

上一篇：ecshop去版权标志删除Powered by ecshop

下一篇：ecshop用户协议字体颜色怎么修改

图文教程

相关源码

(PC+WAP)聚氨酯粉末涂料防腐耐用材料粘合剂网站源码下载为化工涂料企业设计的展示系统，集成产品技术参数库、颜色样板展示器和配方查询模块。支持粉末涂料、环氧树脂等多类产品分类展示查看源码
(自适应响应式)pbootcms紫色美容整形机构企业模板下载基于PbootCMS内核开发的响应式网站模板，为医疗美容机构、整形医院等企业设计，提供完整的线上展示平台采用紫色系配色方案，整体风格专业大气。模板包含首页轮播、服务项目、专家团队、案例展示等核心模块，能够充分展示医疗美容机构的专业服务和特色优势。查看源码
(自适应)文案文档作文写作word资源网站模板下载本模板基于PbootCMS系统深度开发，针对电影解说、文案分享类网站的特殊需求设计。采用响应式布局技术，确保在手机端和桌面端都能呈现专业的内容展示效果，帮助运营者高效管理影视解说资源。查看源码
pbootcms模板(自适应)花店鲜花花卉园艺网站源码一款基于PbootCMS内核开发的花店鲜花配送与花卉园艺企业网站模板。该模板采用响应式设计，自动适配手机、平板等移动设备，确保用户在任何设备上都能获得优质浏览体验。查看源码
(自适应响应式)蓝色勘察设计院机构单位商会协会pbootcms模板下载本模板基于PbootCMS系统开发，为勘察设计院所、工程咨询单位设计，特别适合展示设计成果、技术服务和项目案例。采用响应式技术，确保设计图纸和方案以及文案在不同设备上都能清晰展示。查看源码
(PC+WAP)蓝色不锈钢簧线金属制品营销型pbootcms网站模板本模板基于PbootCMS内核开发，为不锈钢及金属制品企业量身打造。采用响应式设计，适配PC与移动设备，提供统一后台管理体验，数据实时同步更新。查看源码