不同的结果onresize和DOM准备相同的功能？

Question

这段代码假设以元素为中心，它在调整大小时非常有效，但在DOM首次准备就绪时却不能。我必须调整窗口大小以获得所需的结果。我无法弄清楚导致这种情况的原因......这是相同的功能。

        $(document).ready(center);
        $(window).on('resize', center);

        function center(){
            $('#vid').css({
                'position' : 'absolute',
                'left' : '50%',
                'top' : '50%',
                'margin-left' : -$('#vid').width()/2,
                'margin-top' : -$('#vid').height()/2
            });
        }