Question

我正在测试用于iframe的Fancybox，我注意到在我的Wordpress博客上（我猜其他地方）iframe只在我主页的第一个链接上打开。我已将id属性添加到所有链接中。

任何想法是为什么以及如何纠正它？下面是代码。我只将名称更改为弹出窗口并设置为所有链接id =“popup”。在示例页面上，它也使用id，但仅在一个链接上。

<script type="text/javascript">
    $(document).ready(function() {
        $("#popup").fancybox({
            'width'             : '75%',
            'height'            : '75%',
            'autoScale'         : false,
            'transitionIn'      : 'none',
            'transitionOut'     : 'none',
            'type'              : 'iframe'
        });
    });
</script>

Answer 1

ID 必须是唯一的。如果您现有的代码类似于

<a href="whatever" id="popup">Link 1</a>
<a href="whateverelse" id="popup">Link 2</a>

将其改为

<a href="whatever" class="popup">Link 1</a>
<a href="whateverelse" class="popup">Link 2</a>

然后，将您的Javascript调整为

<script type="text/javascript">
    $(document).ready(function() {
        $("a.popup").fancybox({
            'width'             : '75%',
            'height'            : '75%',
            'autoScale'         : false,
            'transitionIn'      : 'none',
            'transitionOut'     : 'none',
            'type'              : 'iframe'
        });
    });
</script>

使用其文档中的代码不适合您的原因是因为他们的文档仅处理单个链接，而不是一组链接。

Answer 2

你正在做的是将一个fancybox添加到一个带有id弹出窗口的实体。如果你想让多个<a>标签拥有自己的fancybox，那么你必须要么为你的efery标签做一个不同的id，或者你给他们同一个不同的“rel”的类。

请参阅此example

Fancybox的问题。 iframe仅适用于网站上的第一个链接

2 个答案: