为什么这个图像/图像元素大小为0px？

Question

我有这个图片标签：

<img id="sidebar" src="images/homepageSidebar.jpeg" style="max-height:800px; float:left; padding-left:10px;"/> 

我试图让图像宽度，使我可以将文本旁边。当我做以下功能时，我得到一个边框宽度为0px：

$(document).ready(function(){ 
    var sidebarWidth = $('#sidebar').width(), 
     introPosition = sidebarWidth + 10; 

    $('#intro').css({ left:introPosition }); 

    console.log(sidebarWidth); 
    console.log(introPosition); 

}); 

有没有人看到我的错误是什么？谢谢。

Answer 1

$(document).ready在构建DOM时但在加载所有资源（如图像）之前触发。您必须使用window.load事件。

$(window).on('load', function(){ 
    var sidebarWidth = $('#sidebar').width(), 
     introPosition = sidebarWidth + 10; 

    $('#intro').css({ left:introPosition }); 

    console.log(sidebarWidth); 
    console.log(introPosition); 

});