发新话题
打印

[共享] 简单,EC可用的图片放大镜效果代码 - Magic Zoom

简单,EC可用的图片放大镜效果代码 - Magic Zoom

演示见
已无水印


这个代码是“拜月小刀 ”告之在下的,,http://bbs.ecshop.com/thread-56058-1-3.html
我随后下载试用了一下,还比较好用的,使用简单,图片大小比例是自动的,包括小图上的白方框

但这代码似乎是要收费的,,下载来的使用时,图片上有文字水印,,好像他的JS里有加密了,
刚才我还在发贴求助,希望有人帮忙把水印去掉,突然想到官方演示是没水印的,
主直接下载了官方的JS文件,
一替换,果然没水印了,哈哈

代码使用方式,下载来,看一下里面的演示就明白了,简单

代码下载:http://www.magictoolbox.com/static/magiczoomtrial.zip
官方无水印JS http://www.magictoolbox.com/static/mz-packed.js
官方演示 http://www.magictoolbox.com/magiczoom/



希望有人能找出小图上的白框的比例哪里调的,现在看起来略显大,不好看



另外问一下,商品的最大张那图的地址标签是什么,,我好像写错了



安装方法在6楼,,由QingHou 提供的,

[ 本帖最后由 阿阿勇 于 2008-9-3 14:26 编辑 ]

附件

mz-packed.rar (4.29 KB)

2008-9-3 14:26, 下载次数: 511

无水印JS

本帖最近评分记录
  • QingHou +1 共享加分 2008-6-24 09:34
俺的站有点大http://aayong.com/

TOP

楼主既然发出共享的代码和下载地址了   可否将使用方法告知我们诸位!
http://www.fengqingfang.cn/北京中高档精品外贸服装供货

TOP

顶,怎么安装啊!

TOP

怎么安装啊? 问下啊
http://www.epeak.net        中国领先的网游动漫影视周边综合服务商

TOP

顶,共享一下安装方法

TOP

安装方法很简单
1,下载楼主给的第一个zip包 http://www.magictoolbox.com/static/magiczoomtrial.zip 解开,里面有个MagicZoom.css,把这个内容复制到ecshop的style.css。

2,下载楼主给的无水印js http://www.magictoolbox.com/static/mz-packed.js 在goods.dwt中载入。

3,找到goods.dwt中商品图片的位置,比如bluesky中是
复制内容到剪贴板
代码:
<a href="{$pictures.0.img_url}" rel="lightbox[example]"><img src="{$goods.goods_img}" alt="" class="thumb"  /></a>
把这句修改为
复制内容到剪贴板
代码:
<a href="{$pictures.0.img_url}" title="{$goods.goods_name|escape:html}" class="MagicZoom" rel="zoom-width: 400px; zoom-position: bottom"><img src="{$goods.goods_img}"/></a>
应该就可以了,没测试。


在样式表里面加
复制内容到剪贴板
代码:
.MagicZoomPup {
    width:50px!important;
    height:50px!important;
}
浮动框高宽自己改上面大小。
提问前请搜索。 模板群:6429401 已离职

TOP

勇哥好厉害呀。喜欢勇哥
 http://www.51043.com 虎门时尚元素 www.51043.com

TOP

引用:
原帖由 QingHou 于 2008-6-24 09:42 发表
安装方法很简单
1,下载楼主给的第一个zip包 http://www.magictoolbox.com/static/magiczoomtrial.zip 解开,里面有个MagicZoom.css,把这个内容复制到ecshop的style.css。

2,下载楼主给的无水印js http:// ...
呵呵,    正是,正是,,,

不过那小方框还有点问题,,
就是改过了,小方框外观变了,但他显示区域没有变小,这样就跟大图显示的区域不对应了
而且小方框也移不到图片的最右下角



小方框相对原尺寸,是向左上角缩放的,
有没有办法变成对原尺寸居中缩放,,这样显示区域就对应了

[ 本帖最后由 阿阿勇 于 2008-6-24 10:20 编辑 ]
俺的站有点大http://aayong.com/

TOP

安装方法在6楼,,由QingHou 提供的,
俺的站有点大http://aayong.com/

TOP

引用:
原帖由 fareign 于 2008-6-24 10:10 发表
勇哥好厉害呀。喜欢勇哥

都大家帮忙
俺的站有点大http://aayong.com/

TOP

发新话题