为 Fancybox 添加缩放功能

发布于 2024-11-06 16:37:22 字数 615 浏览 0 评论 0原文

我正在使用 Fancybox 作为我的缩略图库。我想使用 JQZoom ( http://www.mind-projects.it/projects/ jqzoom/ )以及 fancybox。

最终结果: 1. 用户点击缩略图 2.fancybox出现更大的图像 3. 用户可以将鼠标悬停在图像上以使用 JQZoom 放大更多

现在我已经将其设置为实现此效果。 fancybox 工作完美,但 JQZoom 根本不工作。我使用 firebug 也没有遇到任何错误。

这是页面:

http://waldondigital.com/mix/gallery.html

这是我的 jquery:

http://pastebin.com/3Nc9pzMM

感谢您的宝贵时间,非常感谢赞赏。

I'm using Fancybox for my thumbnail gallery. I'd like to use JQZoom ( http://www.mind-projects.it/projects/jqzoom/ )with the fancybox as well.

The end result:
1. User clicks on thumbnail
2.fancybox appears with larger image
3. User can mouse over image to zoom in more using JQZoom

Right now I have it set up to do this effect. The fancybox works perfectly, but the JQZoom doesn't work at all. I haven't encountered any errors using firebug either.

Here's the page :

http://waldondigital.com/mix/gallery.html

Here's my jquery:

http://pastebin.com/3Nc9pzMM

Thanks for your time, it's greatly appreciated.

如果你对这篇内容有疑问,欢迎到本站社区发帖提问 参与讨论,获取更多帮助,或者扫码二维码加入 Web 技术交流群。

扫码二维码加入Web技术交流群

发布评论

需要 登录 才能够评论, 你可以免费 注册 一个本站的账号。

评论(2

我喜欢麦丽素 2024-11-13 16:37:22

这应该可以解决问题: http://pastebin.com/mg7e0Z1S

它基本上将缩放图像作为内容添加到 < code>$.fancybox 并在通过 onComplete 完成时应用 $.jqzoom()
我禁用了滚动,因为 jqzoom 似乎为较小的图像添加了边框,导致出现水平滚动条。

仅供参考,我只用内联缩放测试了这个......

This should do the trick: http://pastebin.com/mg7e0Z1S

It basically adds the zoom image as content to $.fancybox and applies $.jqzoom() when it's done via onComplete.
I disabled scrolling because jqzoom seems to add a border to the smaller image, resulting in horizontal scrollbars.

FYI, I only tested this with inline zoom...

一抹淡然 2024-11-13 16:37:22

您需要设置 fancybox 缩放来打开包含 JQZoom 代码的 iframe 样式灯箱。可能是一个非常巧妙的组合!

You would need to set up fancybox zoom to open an iframe style lightbox, that contained your JQZoom code. could be a very slick combination!

~没有更多了~
我们使用 Cookies 和其他技术来定制您的体验包括您的登录状态等。通过阅读我们的 隐私政策 了解更多相关信息。 单击 接受 或继续使用网站,即表示您同意使用 Cookies 和您的相关数据。
原文