Stop Spinner.js

Question

Utilizzo spin.js (http://fgnass.github.com/spin.js/) mentre viene caricata un'immagine di larghezza/larghezza completa. Il problema è che ho problemi a fermare lo spinner. Il metodo stop() non sembra funzionare. C'è quello che ho:

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

Ho anche provato

.spin(false) 

e

.data('spinner').stop() 

Questa è le impostazioni Spinner:

$(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

È necessario memorizzare il istanza spinner da qualche parte - in un modo tha t è possibile accedervi quando ne avete bisogno di fermare la filatura:

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

E ora siete in grado di fermare in questo modo:

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

Answer 2

ci si può fermare filatore senza esempio:

$(target).spin(false); 

Answer 3

Rimuovere tutti DOM di containter, ad esempio:

<style type="text/css">.loader{ display: none; }</style> 
<div> 
    <span class="loader"></span> 
    <span>Foo</span> 
</div> 

Se è necessaria sping aggiungerlo in

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

e distruggere:

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

Ricordate, jQuery.empty() rimuovere automaticamente tutti i DOM di oggetto prima di distruggere.

Answer 4

Questo sembra funzionare tutti i browser e utilizza meno codice:

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