Chardin.js - 创建切换按钮

Question

如何为Chardin.js创建切换按钮？ Chardin Website

我知道剧本是所有链接是否正确，当我运行它下面的脚本显示了罚款：

$(document).ready(function(){ 
$('body').chardinJs('start'); 
}); 

不过，我想用户点击一个按钮来显示信息，而不是在文件加载。

我曾尝试：

<script>$('.button').on('click', function(){ 
$('body').chardinJs('start') 
});</script> 

与此：

<span class="button"><a href="#" class="btn btn-large primary" data-toggle="chardinjs" data-intro="This button toggles the overlay, you can click it, even when the overlay is visible" data-position="left">Show Me</a></span>

我怕我找错了树，任何人都可以请指教？ 感谢您的期待。

Answer 1

试试这个

$('#some-button').on('click', function() { $('.container').chardinJs('start') }); 

你可以找到更多在这里：http://www.codersgrid.com/2013/07/03/chardin-js-make-overlay-instructions-easily/

Answer 2

既然你特别要求切换，chardinJs恰好有这样的指令。

HTML（设有自举类也与按钮）：

<link rel="stylesheet" type="text/css" href="~/CSS/chardinjs.css" /> 
... 
<button id="toggleHelp" type="button" class="btn btn-default"><span class="glyphicon glyphicon-question-sign"></span>Help</button> 
... 
<script type='text/javascript' src='~/Scripts/chardin.js'></script> 

然后JS：

// 1. Just initializing 
$(document).ready(function(){ $('body').chardinJs(); }); 

// 2. Later somewhere still during ready bind the event handler 
$('#toggleHelp').on('click', function() { $('body').chardinJs('toggle') }); 

这就是全部。