为什么jquery图像放大镜需要首先显示图片?

时间:2012-05-10 19:34:44

标签: javascript jquery html jplayer

我正在一个托管音乐,图片和视频的网站上工作。我目前有4页,标题页,音乐页,视频页和图像页。这很好用,但我希望能够兼顾播放音乐和同时查看图片的能力。为此,我创建了一个HTML文档,每个以前的页面都在div中,并带有描述性的类名。然后,我编写了一个javascript函数,在调用它时显示并隐藏每个div,因此页面的行为就像它的4页,但事实并非如此。因此,我将音乐播放器嵌入在音乐播放时保持打开的页脚div中,这意味着您可以在保持音乐页脚打开和播放的同时在每种媒体类型之间来回切换。这就是问题所在。完成后,我在图像页面上使用的图像放大镜jquery功能不再正常工作,除非图像div在页面打开时显示在开头。只有这样,您才能在媒体类型之间切换并仍然放大图片。如果首先显示标题div(就像它应该的那样),然后你去尝试放大图像,它就不起作用了。

起初我以为可能有些外部javascript库互相负面交互,但后来我发生了我上面解释的内容,现在我只是为什么图像需要成为第一件事而感到茫然显示放大镜正常工作。

我正在使用的jquery代码叫做jQuery Image Magnify,它是由Dynamic Drive制作的。

编辑:我隐藏并显示div的方式是使用style =“display:none”来隐藏和style =“display:block”来显示。

1 个答案:

答案 0 :(得分:2)

有趣的问题。可能是因为元素需要实际可见才能运行jQuery Image Magnify函数。我愿意打赌插件使用imageElement.onload作为图像放大处理程序或类似的东西,如果图像元素被隐藏,我认为它不起作用。

就解决方案而言,尝试将图像设置为在页面首次加载时可见,也可以将左侧设置为-9999像素或类似于此类似的东西,这样它在技术上仍然是“可见的”但是用户看不到它。然后,在图像加载并(希望)被放大或插件所做的任何事情之后,将其移动为其页面应该打开的div的子项并消除负的左值。