0

我试图让颜色框在页面加载时加载内联 HTML (inline_content_1)。我在用：

$(document).ready(function(){
   $(".inline").colorbox({inline:true, width:"440px"});
   $(".inline").colorbox({href:"#inline_content_1", open:true, width:"330px", height:"640px"});
});

但是，我在页面上还有 4 个其他内联颜色框调用，它们不需要在加载时工作：

<div id='inline_content-2'>...html...</div>
<div id='inline_content-3'>...html...</div>
<div id='inline_content-4'>...html...</div>
<div id='inline_content-5'>...html...</div>

正确的内联 HTML (inline_content_1) 会在加载时弹出，但随后页面上的每个颜色框链接 (inline_content_2,3,4,5) 都会加载“inline_content_1”。

请帮忙？

谢谢！

4

2 回答 2

1

现在，您正在使用选择器“#inline_content-1”告诉所有具有“内联”类的元素。

试试这个：

$(document).ready(function(){
   $(".inline").colorbox({inline:true, width:"440px"});
   $.colorbox({inline:true, href:"#inline_content_1", open:true, width:"330px", height:"640px"});
});
于 2012-06-22T16:16:36.160 回答
0

更改您的选择器以使用您想要出现的 div 的 idonload吗？

$(document).ready(function(){
    $(".inline #inline_content-1").colorbox({inline:true, width:"440px"});
    $(".inline #inline_content-1").colorbox({href:"#inline_content_1", open:true, width:"330px", height:"640px"});
});

感谢您花时间思考这个问题！我目前正在使用：

<link rel="stylesheet" href="/colorbox/colorbox.css" />
<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.7.1/jquery.min.js"></script>
<script src="/colorbox/jquery.colorbox.js"></script>
<script>
    $(document).ready(function(){
        $(".inline").colorbox({inline:true, width:"440px"});
        $(".inline #inline_content_onload").colorbox({href:"#inline_content_onload", open:true, width:"330px", height:"640px"});
    });
</script>
<div style='display:none'>
    <div id='inline_content-1'> HTML here</div>
</div>
<div style='display:none'>
    <div id='inline_content-2'> HTML here</div>
</div>
<div style='display:none'>
    <div id='inline_content-3'> HTML here</div>
</div>
<div style='display:none'>
    <div id='inline_content-4'> HTML here</div>
</div>

<div style='display:none'>
    <div id='inline_content_onload'> HTML onload here</div>
</div>
于 2012-06-21T15:24:21.457 回答