停止Spinner.js

我正在使用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); }; }); 

我也试过了

 .spin(false) 

和

 .data('spinner').stop() 

这是微调器设置：

 $(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); }); 

Answer 1

您需要将spinner实例存储在某处 – 以便在需要它时可以访问它以停止旋转：

 var spinner = new Spinner(opts).spin(target); $(target).data('spinner', spinner); 

而现在你可以像这样阻止它：

 $('#top-bg').data('spinner').stop(); 

Answer 2

您可以在没有实例的情况下停止微调

 $(target).spin(false); 

Answer 3

这似乎适用于浏览器并使用较少的代码：

 $(".spinner").remove(); 

Answer 4

删除所有包含的DOM，例如：

  
  Foo  

如果需要应用sping追加它

 $('.loader').show().spin(); 

毁灭：

 $('.loader').hide().empty(); 

请记住，jQuery.empty（）会在destroy之前自动删除所有DOM对象。