3

我正在使用 jquery lightbox 插件颜色框(http://colorpowered.com/colorbox/),我希望能够构建一个像 www.example.com/about-me.html 这样的 URL,它将用户发送到我的网站和在灯箱脚本中打开 iframed 页面 (about-me.html)。

我相信我必须使用事件挂钩或其他东西,但我不确定如何实现结果。任何帮助表示赞赏。

4

3 回答 3

4

归功于彩盒谷歌组的 Jack Moore。

他的解决方案适应了这个问题:

var url = document.location.href;
if(url.search(/\?about-me/i) !== -1){
    $(".iframe:first").click();

}

所以 url 将是 www.example.com?about-me 这会将用户带到主页,这个 javascript 会找到该参数并告诉 colorbox 打开它。

原始谷歌组线程和更多信息:http ://groups.google.com/

于 2009-09-06T21:49:06.947 回答
1

编辑 - 在下面更新了我的示例源代码

我不熟悉那个灯箱,但我认为您需要做的就是创建一个页面并在 window.load 或 dom 上调用灯箱,例如:

$(document).ready(function () {
   if(document.location.hash){
    //launch colorbox and use this hash
    $.fn.colorbox({width:"50%", inline:true, href:""+document.location.hash+""});
   }
});
于 2009-09-05T13:25:38.000 回答
0

查看有关如何访问其他内容的示例。如果我正确理解您的问题,您想在 iframe 中显示外部源。你可以这样做:

(来自示例页面)

$(".iframe").colorbox({iframe:true});

<p><a class='iframe' href="http://google.com">Outside webpage (IFrame)</a></p>

更新:如果您想要在输入 url 时在页面上出现类似上述代码的内容,那么我建议您使用参数或 url 重写来完成它。这个想法是您的 url 将包含要加载到 iframe 和服务器上的页面,您将提取它并使用它在您的页面上构建类似于上面代码的内容。

http://www.example.com/main?load=about.htm

或者使用类似 MVC 的东西,你可能有:

http://www.example.com/main/about

这将调用主控制器上的 about 操作。这将呈现一个视图,其中包含将“about.htm”内容文件注入 iframe 的代码。

于 2009-09-05T13:29:52.630 回答