javascript 停止 Spinner.js
声明:本页面是StackOverFlow热门问题的中英对照翻译,遵循CC BY-SA 4.0协议,如果您需要使用它,必须同样遵循CC BY-SA许可,注明原文地址和作者信息,同时你必须将它归于原作者(不是我):StackOverFlow
原文地址: http://stackoverflow.com/questions/9958032/
Warning: these are provided under cc-by-sa 4.0 license. You are free to use/share it, But you must attribute it to the original authors (not me):
StackOverFlow
Stop Spinner.js
提问by Connor
I'm using spin.js ( http://fgnass.github.com/spin.js/) while a large full width/height image loads. The problem is I'm having trouble stopping the spinner. The stop() method doesn't seem to work. There's what I've got:
我正在使用 spin.js ( http://fgnass.github.com/spin.js/) 同时加载一个大的全宽/高图像。问题是我无法停止微调器。stop() 方法似乎不起作用。这就是我所拥有的:
$(document).ready(function($) {
var img = new Image();
img.src = $('#top-bg').css('background-image').replace(/url\(|\)/g, '');
img.onload = function(){
$("#top-bg").spinner.stop();
$(".top-bar").delay(1500).fadeIn(5000);
$("#arrow, #arrowrt, #top-icons").delay(5000).fadeIn(5000);
};
});
I also tried
我也试过
.spin(false)
and
和
.data('spinner').stop()
This is the spinner settings:
这是微调器设置:
$(document).ready(function($) {
var opts = {
lines: 9, // The number of lines to draw
length: 11, // The length of each line
width: 4, // The line thickness
radius: 10, // The radius of the inner circle
rotate: 0, // The rotation offset
color: '#fff', // #rgb or #rrggbb
speed: 0.9, // Rounds per second
trail: 54, // 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: 'auto', // Top position relative to parent in px
left: 'auto' // Left position relative to parent in px
};
var target = document.getElementById('top-bg');
var spinner = new Spinner(opts).spin(target);
});
回答by Niko
You need to store the spinner instance somewhere - in a way that you can access it when you need it to stop the spinning:
您需要将微调器实例存储在某处 - 以一种您可以在需要它来停止旋转时访问它的方式:
var spinner = new Spinner(opts).spin(target);
$(target).data('spinner', spinner);
And now you're able to stop it like this:
现在你可以像这样停止它:
$('#top-bg').data('spinner').stop();
回答by Vladimir
You can stop spinner without instance:
您可以在没有实例的情况下停止微调器:
$(target).spin(false);
回答by James
This seems to work across browsers and uses less code:
这似乎可以跨浏览器工作并且使用更少的代码:
$(".spinner").remove();
回答by e-info128
Remove all DOM of containter, example:
删除容器的所有 DOM,例如:
<style type="text/css">.loader{ display: none; }</style>
<div>
<span class="loader"></span>
<span>Foo</span>
</div>
If need apply sping append it in
如果需要应用 sping 将其附加到
$('.loader').show().spin();
And destroy:
并销毁:
$('.loader').hide().empty();
Remember, jQuery.empty() automaticaly remove all DOM of object before destroy.
请记住,jQuery.empty() 会在销毁之前自动删除对象的所有 DOM。