Colorbox.js 内联内容不会显示答案

【问题标题】：Colorbox.js inline content won't showColorbox.js 内联内容不会显示
【发布时间】：2015-11-22 00:27:51
【问题描述】：

我正在尝试将内联内容功能与 colorbox.js 一起使用，但在使用内联功能时它似乎没有显示，尽管所有其他功能都正常工作。我正在使用未经编辑的 JS 和 CSS 文件。这是代码：

$(document).ready(function(){
$(".inline").colorbox({inline:true, width:"50%", transition:'none'});
});

HTML

<a class="inline" href="#inline_content"><li><h1>Content</h1></li></a>
<div style='display:none'>
<div id='inline_content' style='padding:10px; background:#fff; color:#000;'>   
<p>Hello! This is content </p> 
</div>
</div>

【问题讨论】：

标签： javascript jquery html css colorbox

【解决方案1】：

inline 选项要求您还设置 href 选项。

如果为 true，则可以通过传递显示当前文档中的内容 href 属性是一个 jQuery 选择器或 jQuery 对象。

// Using a selector:
$("#inline").colorbox({inline:true, href:"#myForm"});
// Using a jQuery object: var $form = $("#myForm");
$("#inline").colorbox({inline:true, href:$form});

See the documentation.

【讨论】：

我看到页面没有使用它来工作。我尝试将 JS 更改为 $(document).ready(function(){ $(".inline").colorbox({inline:true, width:"50%", transition:'none', href:" #inline_content"}); });它仍然无法正常工作

【解决方案2】：

你可以使用href。

例如：

<a href="#myForm" class="inline">

那么，你可以这样：

$(".inline").colorbox({
inline: true,
width: "50"
});

【讨论】：