我正在测试iframe的Fancybox,我注意到在我的Wordpress博客上(我猜其他地方)iframe仅为我主页上的第一个链接打开。我已经为所有的链接添加了id属性。
有什么想法是为什么和如何纠正它?下面是代码。我只更改了名称弹出,并设置为所有链接id="弹出"。在示例页面上,它也使用id,但只在一个链接上。
<script type="text/javascript">
$(document).ready(function() {
$("#popup").fancybox({
'width' : '75%',
'height' : '75%',
'autoScale' : false,
'transitionIn' : 'none',
'transitionOut' : 'none',
'type' : 'iframe'
});
});
</script>
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>
使用他们文档中的代码不适合你的原因是因为他们的文档只处理单个链接,而不是一组链接。
你正在做的是添加一个花哨的盒子到一个实体与id弹出。如果你想要多个<a>
标签有自己的fanybox,那么你必须要么做你所做的每一个标签与不同的id或你给他们相同的类与不同的"rel"。
参见这个例子