将缩放添加到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

This should do the trick: 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屋！