在页面加载完成之前让 colorbox 工作

发布于 2024-11-29 18:21:37 字数 422 浏览 0 评论 0原文

我在页面 HEAD 中有以下代码:

    <script  type="text/javascript">        
$(document).ready(function(){
    $(".open_popup_clips").colorbox({width:"520px",height:"480px", iframe:true});       
});
</script>  

因此,只有当页面完成加载时,弹出窗口才会正确打开,在此之前
将以常规方式在浏览器窗口中打开链接。
是在页面完全加载之前使链接在弹出窗口中打开的一种方法。我尝试将这段代码放在 BODY 中,但这不起作用..
当然,最好的办法是加快加载过程,但我们现在先把它放在一边。

感谢您的重播,祝您有美好的一天:-)

i have the following piece of code in the page HEAD:

    <script  type="text/javascript">        
$(document).ready(function(){
    $(".open_popup_clips").colorbox({width:"520px",height:"480px", iframe:true});       
});
</script>  

as a result, the pop up will open correctly only when the page finished loading, before that it
will open the link in the browser window, the regular way.
is the a way to make links open in pop up before page has completely loaded. i tried placing this block of code in the BODY but that did not work..
the best thing of course would be to speed up the load process but let's leave that aside for now.

thanx for any replay and have a nice day :-)

如果你对这篇内容有疑问,欢迎到本站社区发帖提问 参与讨论,获取更多帮助,或者扫码二维码加入 Web 技术交流群。

扫码二维码加入Web技术交流群

发布评论

需要 登录 才能够评论, 你可以免费 注册 一个本站的账号。

评论(2

梨涡 2024-12-06 18:21:37

这里有两个选择:

一,将 JavaScript 代码放在 BODY 的底部,而不使用 document.ready。这将比 document.ready 绑定更快。

第二,将 JavaScript 代码放在要调用 colorbox 的元素正下方。这有点混乱,但会在元素添加到 DOM 后立即调用,并且是最快的选择。

对于此类事情,这些几乎是您唯一的选择,因为比就绪事件更快。

如果您想冒险进入恐怖维尔,请查看:http:// /javascriptisawesome.blogspot.com/2011/07/faster-than-jquerydocumentready-wait.html 说实话,我以前没有尝试过。

There's two options here:

One, place your JavaScript code at the BOTTOM of your BODY without the document.ready. This will be faster than document.ready binding.

Two, place your JavaScript code right below the element you're calling colorbox on. This is a little bit more messy, but will be called right after the element is added to the DOM and is your fastest option.

These are pretty much your only options as far as something faster than the ready event go for this sort of thing.

If you want to venture into scaryville, check this out: http://javascriptisawesome.blogspot.com/2011/07/faster-than-jquerydocumentready-wait.html To be honest, I haven't tried it before.

隔岸观火 2024-12-06 18:21:37

Adam 的答案通常是很好的建议,但它对当前版本的 colorbox 没有帮助,因为它会等待 DOM 加载,然后再将其标记添加到文档中。要更快地运行它(例如,在您想要使用 colorbox 的元素之后立即运行),您必须对 jquery.colorbox.js 文件进行少量编辑。像这样注释掉以下行:

// $(publicMethod.init);

然后,当您准备好初始化 colorbox 时,手动调用 init() 。例子:

<a href='1.jpg' class='example'>1</a>
<a href='2.jpg' class='example'>2</a>
<a href='3.jpg' class='example'>3</a>
<script>
  $.colorbox.init();
  $('a.example').colorbox();
</script>

Adam's answer is typically good advice, but it isn't going to help with the current version of colorbox because it waits for the DOM to load before adding it's markup to your document. To run it sooner (say, immediately after the elements you want to use colorbox with) you'll have to make a small edit to the jquery.colorbox.js file. Comment out the following line like so:

// $(publicMethod.init);

Then manually call init() manually when you are ready to initialize colorbox. Example:

<a href='1.jpg' class='example'>1</a>
<a href='2.jpg' class='example'>2</a>
<a href='3.jpg' class='example'>3</a>
<script>
  $.colorbox.init();
  $('a.example').colorbox();
</script>
~没有更多了~
我们使用 Cookies 和其他技术来定制您的体验包括您的登录状态等。通过阅读我们的 隐私政策 了解更多相关信息。 单击 接受 或继续使用网站,即表示您同意使用 Cookies 和您的相关数据。
原文