向 Fancybox 添加缩放 [英] Adding zoom to Fancybox

问题描述

我将 Fancybox 用于我的缩略图库.我想使用 JQZoom ( http://www.mind-projects.it/projects/jqzoom/ ) 和fancybox.

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.

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

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

现在我已经将它设置为执行此效果.fancybox 完美地工作，但 JQZoom 根本不工作.我也没有遇到任何使用 firebug 的错误.

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.

这是页面:

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

这是我的 jquery:

Here's my jquery:

http://pastebin.com/3Nc9pzMM

感谢您的宝贵时间，非常感谢.

Thanks for your time, it's greatly appreciated.

推荐答案

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

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

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...

这篇关于向 Fancybox 添加缩放的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！