将微调器放置在另一个元素的中间（javascript）

Question

我知道这应该很简单，但是一个小时或更长时间无法完成。

我有一个大小不一的画布，因此我想将微调器始终放置在画布上方和中间。 尝试过这样的事情：

    $rootScope.centerSpinner = function() {
        var spinner = $('.md-spinner');
        var canvas = $('.canvas-container');

        spinner.css({
            'top'  : (canvas.outerHeight() / 2) - (spinner.outerHeight(true) / 2),
            'left' : (canvas.outerWidth() / 2) - (spinner.outerWidth(true) / 2)
        });


    }

不工作。

Answer 1

这比我想象的要容易：

   $rootScope.centerSpinner = function() {
        var spinner = $('#spinner');
        var left = $('#canvas').offset().left + $('#canvas').width()/2;
        var top = $('#canvas').offset().top + $('#canvas').height()/2;

        $('#spinner').css({
            "position" : "absolute",
            "left"     : left,
            "top"      : top
        });
    }