完善 风过落叶 仿京东2.72 GBK模板 商品列表页 小图切大图功能

2016-07-07 16:11 来源:www.chinab4c.com 作者:ecshop专家



原帖地址:http://bbs.ecshop.com/viewthread.php?tid=129523&highlight=
感谢他的分享
测试后发现 商品列表页并没有小图切大图效果
我在他源码的基础上修改了下~实现了商品列表页的小图切大图功能
效果见:http://www.jysm.tk/category.php?id=28
在category.dwt头部加入

  1. <link href="themes/360/magiczoomplus.css" rel="stylesheet" type="text/css" />
复制代码

  1. <script src="themes/360/js/preview_templates.js" language="JavaScript" type="text/javascript"></script>
复制代码

  1. <script src="themes/360/js/loader.js" language="JavaScript" type="text/javascript"></script>
复制代码


在category.dwt <body>里加入

  1. <div style="display: none; position: absolute;z-index:110; " id="preview_div"></div>
复制代码


在goods_list.lbi大概68行的位置

  1. <a href="{$goods.url}"><img src="{$goods.goods_thumb}" alt="{$goods.goods_name}" /></a><br />
复制代码


改为

  1. <a href="{$goods.url}"><img src="{$goods.goods_thumb}" alt="{$goods.goods_name}" onmouseover="showtrail('{$goods.goods_img}','{$goods.name}',300,300)" onmouseout="hidetrail()" /></a><br />
复制代码


如果不成功我把CSS 和JS文件分享上来~

回答:
沙发自己坐~~~

那来个板凳吧