私はこの JavaScript Spinner/loader プロジェクトhttp://fgnass.github.io/spin.js/を使用しています
ここの JSFiddle にいくつかのコードがありますhttp://jsfiddle.net/jasondavis/9pBsr/これは私の進行状況を示しています。私が持っているすべての機能でやり過ぎのように見えるかもしれませんが、この投稿に関係のないものはすべて取り除きました. ですから、私を助けることができるなら、すべての構造をそのままにしておいてください。
今私の問題。私が使用しているライブラリには、スピナーを表示するためのこのコードがあります
var spinner = new Spinner(opts).spin(target);
ドキュメントには、スピナーを強制終了して非表示にしてstop
関数を実行するように書かれてSpinner
いますが、私のコードが構造化されている方法では、次のようなエラーが発生し続けるため、スピナーにアクセスする方法がわかりません
TypeError: Cannot call method 'stop' of undefined
私の最終結果は、これを呼び出して、スピナーを停止/強制終了できるようにすることです...
zPanel.loader.hideLoader()
ここに私の JavaScript がありますが、すべての JS と HTML はこの JSFiddle http://jsfiddle.net/jasondavis/9pBsr/にあります。
zPanel.loader.hideLoader()
関数を呼び出す関数zPanel.loader.buildSpinner()
を取得するのを手伝ってくださいSpinner.stop()
var zPanel = {
init: function() {
$(document).ready(function() {
zPanel.loader.init();
});
},
loader: {
init: function() {
//Bind zloader to button click
$('#button').click(function() {
zPanel.loader.showLoader();
});
$('#hidebutton').click(function() {
zPanel.loader.hideLoader();
});
},
showLoader: function() {
//Show Spinning Loader
$('#zloader_overlay').fadeIn('fast', function() {
$("#zloader").show();
zPanel.loader.buildSpinner();
});
},
hideLoader: function() {
//Hide Spinning Loader
$('#zloader_overlay').fadeIn('fast', function() {
$("#zloader").hide();
// This is the function that is not working yet
//zPanel.loader.spinner('stop');
zPanel.loader.buildSpinner.spinner.stop();
});
},
buildSpinner: function() {
var opts = {
lines: 9, // The number of lines to draw
length: 11, // The length of each line
width: 13, // The line thickness
radius: 40, // The radius of the inner circle
corners: 0.4, // Corner roundness (0..1)
rotate: 0, // The rotation offset
color: '#000', // #rgb or #rrggbb
speed: 1, // Rounds per second
trail: 60, // Afterglow percentage
shadow: false, // Whether to render a shadow
hwaccel: false, // Whether to use hardware acceleration
className: 'spinner', // The CSS class to assign to the spinner
zIndex: 2e9, // The z-index (defaults to 2000000000)
top: 200, // Top position relative to parent in px
left: 'auto' // Left position relative to parent in px
};
var target = document.getElementById('zloader_content');
var spinner = new Spinner(opts).spin(target);
// I need to call spinner.stop() some how from my function above name hideLoader()
},
}
};
zPanel.init();