停止Spinner.js [英] Stop Spinner.js

查看:96
本文介绍了停止Spinner.js的处理方法,对大家解决问题具有一定的参考价值,需要的朋友们下面随着小编来一起学习吧!

问题描述

我正在使用spin.js( http://fgnass.github.com/spin.js / )加载大的全宽/高图像。问题是我在阻止旋转器方面遇到了麻烦。 stop()方法似乎不起作用。我得到的是:

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:

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


推荐答案

您需要将微调器实例存储在某处 - 在当你需要它来停止旋转时你可以访问它的方式:

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

这篇关于停止Spinner.js的文章就介绍到这了,希望我们推荐的答案对大家有所帮助,也希望大家多多支持IT屋!

查看全文
登录 关闭
扫码关注1秒登录
发送“验证码”获取 | 15天全站免登陆