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') }); 

這就是全部。