एक छिपे हुए div

Question

के अंदर छवि की ऊंचाई प्राप्त करें, मैं एक छिपी हुई डिवी-कंटेनर के अंदर एक छवि की ऊंचाई/चौड़ाई प्राप्त करना चाहता हूं, लेकिन .height() और .width() दोनों रिटर्न 0 (अपेक्षित) हैं।

$('body').append('<div id="init"><img id="myimg" src="someimage.png" /></div>'); 
$('#init').hide(); 
$('#myimg').height(); // == 0 
$('#myimg').width(); // == 0 

मैं छवि की सही ऊंचाई/चौड़ाई कैसे प्राप्त कर सकता हूं? कोई नहीं: मैं, Biggie

Answer 1

इसकी क्योंकि छवि अभी तक लोड नहीं है .....

$('body').append('<div id="init"><img id="myimg" src="something.png" /></div>'); 
$('#init').hide(); 

$('#myimg').bind("load",function(){ 
    alert(this.height) //works 
})​ 

यहाँ एक परीक्षण: http://jsfiddle.net/WMpSy/

Answer 2

:-)

सादर कुछ निर्णय लेने के क्रम ऊंचाई की गणना या div बजाय प्रदर्शन का उपयोग कर के बंद स्क्रीन को छिपाने के लिए में div अस्थायी रूप से दिखाई दे और इसकी आवश्यकता है। मैंने पहले दृष्टिकोण का उपयोग किया है, और यह पर्याप्त तेज़ पाया है कि आप कभी तत्व नहीं देखेंगे।

Answer 3

यदि आप सही ऊंचाई और चौड़ाई चाहते हैं तो आप इसे छुपा नहीं सकते हैं, लेकिन आप इसे स्थानांतरित कर सकते हैं जैसे कि यह स्क्रीन से बाहर हो जाएगा, और इस प्रकार प्रभावी रूप से छुपाया जाएगा। इस प्रयास करें:

var hiddenDiv = $('<div id="init"><img id="myimg" src="someimage.png" /></div>').appendTo('body').css({ 
    'position': 'absolute', 
    'top': -9999 
}); 

var img = hiddenDiv.children('img'); 
img.height(); 
img.width(); 

Answer 4

ऐसा लगता है कि एक छवि की ऊंचाई & चौड़ाई की गणना करने की जरूरत है लग रहा है। यदि हां, तो आप इसके बारे में बहुत कठिन सोच रहे हैं।

Answer 5

आप खोज() का उपयोग करने के लिए है

$('body').find('#myimg').width(); 

या

$('body').find('#myimg').attr("width"); 

क्योंकि आप इसे संलग्न है के बाद डोम

Answer 6

लोड किया गया था मैं तुम्हारे साथ ऐसा कर सकते हैं यकीन नहीं है jQuery (या बिल्कुल जावास्क्रिप्ट)। मुझे लोडिंग/छुपा img पर गलत रिपोर्ट की गई ऊंचाई और चौड़ाई के साथ एक ही समस्या थी। हालांकि, आप, छवि भार का इंतजार यह सही ऊंचाई और चौड़ाई है और फिर माता-पिता को छिपाने ... की तरह तो कर सकते हैं:

var height, width; 

$('#myimg').load(function() { 
    height = $(this).height(); 
    width = $(this).width(); 
    $('#init').hide(); 
} 

Answer 7

मैं सिर्फ इस बात के लिए समाधान भर में भाग गया, तो आप क्या jQuery पर भरोसा करने के बजाय आप के लिए यह करने के लिए है। इसके बजाय, जावास्क्रिप्ट तत्व हो और तत्व के ही बंद ऊंचाई प्राप्त इस प्रकार है:

var img = hiddenDiv.children('img'); 

var imgHeight = img.get(0).height; 
var imgWidth = img.get(0).width; 

jQuery विधि get(0) हमें पर्याप्त अंतर्निहित डोम तत्व पर मिलता है और दिलचस्प बात करने के लिए अनुमति देता है, डोम तत्व आयाम नहीं है परिवर्तन।

प्रदर्शन नोट्स के लिए हालांकि, एक नोट हालांकि, यदि आप इसे और अधिक उपयोग करने की योजना बना रहे हैं तो आप img.get(0) को कैश करना चाहेंगे।

jQuery get method documentation

Answer 8

मैं एक ऐसी ही समस्या थी। बात यह है कि यदि किसी छवि या छवि वाले किसी छवि में शैली = "प्रदर्शन: कोई नहीं" है तो इसकी सीएसएस ऊंचाई = 0 है। मैंने पाया कि ऊंचाई() और चौड़ाई() कार्यों ने गलत मान दिए, उदाहरण के लिए 0! मेरे लिए समाधान यह सुनिश्चित करना था कि छवियों में उनके गुण सेट हों, भले ही वे छुपाए गए हों, मान अभी भी सुलभ हैं।तो उपयोग करें:

$ ('# testImg')। Attr ('ऊंचाई') और $ ('# testImg')। छवि की ऊंचाई और चौड़ाई प्राप्त करने के लिए attr ('width')।

Answer 9

हाँ अपने क्योंकि छवि अभी तक लोड नहीं है और यह मेरा समाधान है:

$('<img src="My Image URL" />').appendTo('body').css({ 
       'position': 'absolute', 
       'top': -1 
      }).load(function() { 
       console.log('Image width: ' + $(this).width()); 
       console.log('Image height: ' + $(this).height()); 
       $(this).remove(); 
      });