发新话题
打印

[待解决] 放大镜效果请教【已解决的朋友请进】

放大镜效果请教【已解决的朋友请进】

参考了阿阿勇的帖子:http://bbs.ecshop.com/viewthread.php?tid=56301&extra=&page=1###
完整按照QingHou 六楼的办法。产品页无法显示效果。
测试成功的朋友请教一下。偶新建HTML页面,载入JS,CSS,一张大图,一张小图就可以出现效果。
-----------------------------------------

1.<link href="css/MagicZoom.css" rel="stylesheet" type="text/css" />
PS:我把MagicZoom.css放到模板的css文件夹下了。和复制到style.css一样的,这个应该没问题吧?

2.{insert_scripts files='common.js,global.js'} (在这里模仿litebox放大效果载入此JS)
  <script type="text/javascript" src="js/prototype.lite.js"></script>
  <script type="text/javascript" src="js/moo.fx.js"></script>
  <script type="text/javascript" src="js/litebox-1.0.js"></script>
<script type="text/javascript" src="js/mz-packed.js" ></script>

PS:mz-packed.js放在模板的js文件夹下。
偶新建一HTML页面,同放在模板*.dwt文件一起
载入JS,CSS,一张大图,一张小图可以出现效果。故CSS,JS的调用路径没问题。

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>

PS:以上是完整按照QingHou 六楼的办法,可是不管怎么样测试都不会出现效果。

求助:不知道问题出现在哪儿,希望QINGHOU或阿阿勇或者已经修改出效果的朋友指点一下!非常感谢!

TOP

顶你,我也没有解决这个问题,真试郁闷!

TOP

看一下页面源文件,,JS和CSS文件路径有没有自动对应该到模版文件夹里,

我那时候用的好像是全路径,不是下面这个


<script type="text/javascript" src="js/mz-packed.js" ></script>
俺的站有点大http://aayong.com/

TOP

JS路径是根据根目录来的

TOP

我那时用<script type="text/javascript" src="js/mz-packed.js" ></script>

在页面上好像不会自动应该到文件夹的
俺的站有点大http://aayong.com/

TOP

已经解决,不过图片位置有便宜!

TOP

怎么解决的,我的也是相同的问题?谢谢

TOP

我用的办法不一样!http://itwalls.cn  但不知道能否帮你

TOP

发新话题