blocks|key|1419999|text|我猜这是因为你没有等待图像加载--试试这个：|type|unstyled|depth|inlineStyleRanges|entityRanges|data|1420000|var+newimage+=+new+Image();
newimage.src+=+'retouche-hr'+%2B+newlinkimage.substring(14,17)+%2B+'-a.jpg';+
newimage.onload+=+function()
{
++++var+width+=+this.naturalWidth;
++++alert(width);
}|code-block|syntax|javascript|1420001|entityMap^0|0|0^^$0|@$1|2|3|4|5|6|7|I|8|@]|9|@]|A|$]]|$1|B|3|C|5|D|7|J|8|@]|9|@]|A|$E|F]]|$1|G|3|-4|5|6|7|K|8|@]|9|@]|A|$]]]|H|$]]

<p>I'd guess it's because you're not waiting for the image to load - try this:</p>

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


blocks|key|1204947|text|这是最终的工作代码..。以防有人想知道。这一切都是等待图像加载完成的问题！|type|unstyled|depth|inlineStyleRanges|entityRanges|data|1204948|<script+type="text/javascript">
++++$(function()+{
++++++++$("#thumb").jCarouselLite({
++++++++++++btnNext:+"#down",
++++++++++++btnPrev:+"#up",
++++++++++++vertical:+true,
++++++++++++visible:+4
++++++++});

++++++++$("#thumb+li+img").click(function()+{
++++++++++++var+newlinkimage+=+$(this).attr("src");
++++++++++++newlinkimage+=+'retouche-hr'+%2B+newlinkimage.substring(14,17);

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

++++++++++++var+newimage+=+new+Image();
++++++++++++newimage.src+=+newlinkimage+%2B+'-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="'+%2B+newlinkimage+%2B'-a.jpg"></div>');
++++++++++++++++$("#hr").append('<div+id="apres">+<img+alt="after"+src="'+%2B+newlinkimage+%2B'-b.jpg"></div>');
++++++++++++++++//alert('b');
++++++++++++++++$("#avant+img").attr("src",+newlinkimage+%2B+'-a.jpg').attr("width",+width).attr("height",+height);
++++++++++++++++$("#apres+img").attr("src",+newlinkimage+%2B+'-b.jpg').attr("width",+width).attr("height",+height);

++++++++++++++++$("#apres+img").load(function(){$("#hr").beforeAfter({animateIntro:true});});++++++++
++++++++++++}++
++++++++})
++++});
</script>|code-block|syntax|javascript|1204949|entityMap^0|0|0^^$0|@$1|2|3|4|5|6|7|I|8|@]|9|@]|A|$]]|$1|B|3|C|5|D|7|J|8|@]|9|@]|A|$E|F]]|$1|G|3|-4|5|6|7|K|8|@]|9|@]|A|$]]]|H|$]]

<p>Here is the FINAL WORKING CODE... in case somebody wants to know. It's all a matter of waiting until the images have loaded!</p>

<pre><code>&lt;script type="text/javascript"&gt;
    $(function() {
        $("#thumb").jCarouselLite({
            btnNext: "#down",
            btnPrev: "#up",
            vertical: true,
            visible: 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('&lt;div id="hr"&gt; &lt;/div&gt;');
                $("#hr").attr("width", width).attr("height", height);
                $("#hr").addClass('hrviewer');
                //alert('a');
                $("#hr").append('&lt;div id="avant"&gt; &lt;img alt="before" src="' + newlinkimage +'-a.jpg"&gt;&lt;/div&gt;');
                $("#hr").append('&lt;div id="apres"&gt; &lt;img alt="after" src="' + newlinkimage +'-b.jpg"&gt;&lt;/div&gt;');
                //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});});        
            }  
        })
    });
&lt;/script&gt;
</code></pre>


blocks|key|1420045|text|对我来说，下面的工作...|type|unstyled|depth|inlineStyleRanges|entityRanges|data|1420046|++++$('<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;
++++++++}|code-block|syntax|javascript|1420047|entityMap^0|0|0^^$0|@$1|2|3|4|5|6|7|I|8|@]|9|@]|A|$]]|$1|B|3|C|5|D|7|J|8|@]|9|@]|A|$E|F]]|$1|G|3|-4|5|6|7|K|8|@]|9|@]|A|$]]]|H|$]]

<p>For me the following works ...</p>

<pre><code>    $('&lt;img src="mypathtotheimage.png"/&gt;').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;
        }
</code></pre>


<p>image naturalWidth return zero... that's it, why ?</p>

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

<p>HELP, i dont know why !</p>

<p>*** that path is good, the image show up !</p>


image naturalWidth return zero

图像naturalWidth返回零...就是这样，为什么？var newimage = new Image();newimage.src = 'retouche-hr' + newlinkimage.substring(14,17) + '-a.jpg'; var width = newimage.naturalWid...

问图像naturalWidth返回零
EN

社区

活动

资源

关于

腾讯云开发者

热门产品

热门推荐

更多推荐

问图像naturalWidth返回零EN

社区

活动

资源

关于

腾讯云开发者

热门产品

热门推荐

更多推荐

问图像naturalWidth返回零
EN