ColorBox iframe rel (群展)答案

【问题标题】：ColorBox iframe rel (group)ColorBox iframe rel (群展)
【发布时间】：2012-06-30 14:36:08
【问题描述】：

我真的卡住了.. 一直坐在这段代码中.. 尝试使用 ColorBox 制作画廊，看起来非常好.. 我只是有一个问题.. 使用 iframe 时我无法将它变成一个组。 ..

http://www.lani.dk/thomas/temp/iframe_problem.zip

网站

<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>-</title>

 <link media="screen" rel="stylesheet" href="css/colorbox.css" />
<script src="scripts/jquery.min.js"></script>
<script src="scripts/jquery.colorbox.js"></script>
<script>
function showColorBox(imageURL) {
$.fn.colorbox({ opacity: .6, open: true, href: imageURL });
}
</script>

 </head>
<body>
<iframe src="iframe.asp" name="iframename" width="400" height="400" frameborder='0'     id="iframename">
<p>Your browser does not support iframes.</p>
</iframe>
</body>
</html>

iframe

<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>-</title>

<style type="text/css">
body {
background-color: #999;
}
</style>

<script src="scripts/jquery.min.js"></script>
<script src="scripts/jquery.colorbox.js"></script>
<script>
$(document).ready(function () {
 $('a.colorbox').click(function (event) {
    event.preventDefault(); 
    parent.showColorBox($(this).attr("href"));
});
});
</script>

</head>
<body>

<p><a href="images/gallery/pic1.jpg" class="colorbox" rel="group1">pic1</a></p>
<p><a href="images/gallery/pic2.jpg" class="colorbox" rel="group1">pic2</a></p>
<p><a href="images/gallery/pic3.jpg" class="colorbox" rel="group1">pic2</a></p>

</body>
</html>

【问题讨论】：

你可以试试漂亮的照片插件。和你需要的差不多
请问iframe的目的是什么..？如果你不使用一个，你可以做$('a.gallery').colorbox({rel:'group1'});
它适用于我已经拥有 iframe 的网站，完整的背景图片是一个缓慢移动的幻灯片 - 所以我不想打开画廊图片 - lani.dk/thomas/temp/snapshot.jpg

标签： jquery iframe colorbox rel

【解决方案1】：

请记住，ColorBox 会在页面加载时扫描 DOM 以获取要呈现的资产。我怀疑插件看不到 iframe 中的资产，因此无法识别它们。

PS。喜欢糖果般的嘴唇。

【讨论】：