Question

请查看下面的链接，然后点击每个项目 http://seerman.ir/index.php?page=products&cat=tableau&sid=43
一旦你点击一个新的缩略图，Fancybox运行良好，直到它想要显示图片。在显示图片时，包装盒移动到底部。但是当你想要点击它后再次看到同一个项目时，一切都会正确显示。我该如何解决这个问题？

Answer 1

我建议你在网站上修改一些内容：

1）。使用单个jQuery实例。目前您正在加载版本1.8.0和1.7.0

2）。如果在同一页面中它们应该是唯一的，那么您有几个重复的ID，因此请更改此链接

<a id="example1" href=pages/details.php?cat=tableau&id=35&code=1123>...

进入这个

<a class="example1" href="pages/details.php?cat=tableau&id=35&code=1123">...

注意我还在href=" "

中添加了缺失的引号

3）。 fancybox不知道你正在打开图片，因为链接的格式（href）所以它从初始内容计算框的位置，然后从该位置渲染图像，所以改变这个

j("a#example1").fancybox();

进入这个

j("a.example1").fancybox({
    type: "image",
    onComplete: function () {
        var repos = setTimeout(function () {
            $.fancybox.center();
        }, 1000)
    }
});

检查 FAQs No.6以获取更多信息。

注意我将选择器的前缀从#更改为.，因为我们现在正在使用类

编辑：由于你的php文件在图像之前返回一些数据，因此fancybox顶部位置是根据数据计算的。您可能希望在显示图像后运行$.fancybox.center()方法。使用settimeout

加载几秒钟

Fancybox外观不同

1 个答案: