Jquery.height() return 0 for an img tag -
<script type="text/javascript" src="jquery-1.4.full.js"></script> <body> </body> <script type="text/javascript"> var jdialog = $('<div id="avatar_button_clipdiv" style="width: 668px; height: 425px">\ <img width="668" height="900" src="http://localhost/1_tmp.jpg" style="">\ </div>').appendto('body'); console.log(jdialog.find('img')); console.log(jdialog.find('img').width(),jdialog.find('img').height()); </script> this code works fine after put alone in file,the height() returns right value instead of 0,but when put full html file,it returns 0 instead of real value,it weired , not have idea on possiblely make act differently.
i've edited css file before run code,can not remember lines of css had edited.the selectors correct , i've checked return object,nothing wrong either in seperate code or original html file.can shed light on css changes make kind of difference while using $().height();
edit
i've spot on following css code , after commented them ,the height can retrieved correctly,but still have no idea why happening,here code
img { width: auto\9; height: auto; max-width: 100%; vertical-align: middle; border: 0; -ms-interpolation-mode: bicubic; } height: auto; i've commneted out,but how height:auto effected $().height();
the code shared seems job ran in jsfiddle link:
var jdialog = $('<div id="avatar_button_clipdiv" style="width: 68px; height: 125px">\ <img width="50" height="100" src="https://www.google.co.il/images/srpr/logo4w.png" style=""/>\ </div>').appendto('body'); console.log(jdialog.find('img')); console.log(jdialog.find('img').width(),jdialog.find('img').height()); does happes on specific browser?
Comments
Post a Comment