2009-10-29 13 views
16

छवि प्राकृतिकविड्थ शून्य वापस ... यह है, क्यों?छवि प्राकृतिकविड्थ वापसी शून्य

var newimage = new Image(); 
newimage.src = 'retouche-hr' + newlinkimage.substring(14,17) + '-a.jpg'; 
var width = newimage.naturalWidth; 
alert (width); 

सहायता, मुझे नहीं पता क्यों!

*** वह पथ अच्छा है, छवि दिखाती है!

उत्तर

34

मैं क्योंकि आप छवि को लोड करने के लिए इंतज़ार कर नहीं कर रहे हैं यह है लगता है कि चाहते हैं - इस प्रयास करें:

var newimage = new Image(); 
newimage.src = 'retouche-hr' + newlinkimage.substring(14,17) + '-a.jpg'; 
newimage.onload = function() 
{ 
    var width = this.naturalWidth; 
    alert(width); 
} 
+5

जिस क्रम 'src' और' में onload' सेट कर रहे हैं महत्वपूर्ण के लिए लोड कॉलबैक कहा जाता है करने के लिए है। –

+0

हम्म मैंने क्रोम और फ़ायरफ़ॉक्स में परीक्षण किया और वे दोनों ठीक काम करते थे। आईई ने चेतावनी भी दिखायी लेकिन प्राकृतिकविड्थ का समर्थन नहीं करता – Greg

+0

बहुत बहुत धन्यवाद! एक आकर्षण की तरह काम किया –

0

naturalWidth और naturalHeight गुण IE में समर्थित नहीं हैं, इसलिए this fix आजमाइए।

+0

"सामान्य" चौड़ाई और ऊंचाई के बारे में कैसे – menardmam

2

यहाँ पता करने के लिए whant मामले किसी में अंतिम श्रमजीवी कोड है ...., यह सभी छवियों को लोड करने के लिए wainting के सभी एक बात! ...

<script type="text/javascript"> 

$ (function() { $ ("# अंगूठे") jCarouselLite ({ btnNext: "#down", btnPrev: "#up", ऊर्ध्वाधर: सच है, दिखाई: 4 });

$("#thumb li img").click(function() { 

    var newlinkimage = $(this).attr("src"); 
    newlinkimage = 'retouche-hr' + newlinkimage.substring(14,17); 

    $('#hr').remove(); 

    var newimage = new Image(); 
    newimage.src = newlinkimage + '-a.jpg'; 

    newimage.onload = function() 
    { 
     var width = (newimage.width); 
     var height = (newimage.height); 

     $('#contentfull').append('<div id="hr"> </div>'); 
     $("#hr").attr("width", width).attr("height", height); 
     $("#hr").addClass('hrviewer'); 
     //alert('a'); 
     $("#hr").append('<div id="avant"> <img alt="before" src="' + newlinkimage +'-a.jpg"></div>'); 
     $("#hr").append('<div id="apres"> <img alt="after" src="' + newlinkimage +'-b.jpg"></div>'); 
     //alert('b'); 
     $("#avant img").attr("src", newlinkimage + '-a.jpg').attr("width", width).attr("height", height); 
     $("#apres img").attr("src", newlinkimage + '-b.jpg').attr("width", width).attr("height", height); 

     $("#apres img").load(function(){$("#hr").beforeAfter({animateIntro:true});}); 

    } 

}) 

। });

0

मेरे लिए निम्नलिखित काम करता है ...

$('<img src="mypathtotheimage.png"/>').load(function() { 

     if (!isNotIe8) { 
      // ie8 need a fix 
      var image = new Image(); // or document.createElement('img') 
      var width, height; 
      image.onload = function() { 
       width = this.width; 
       height = this.height; 
      }; 
      image.src = $(this).attr("src"); 

     } else { 
      // everythings fine here .... 
      // this.naturalWidth/this.naturalHeight; 
     } 
संबंधित मुद्दे