problem with javascript and returning a value

The problem i think is when you execute find_img_dm, you are trying to return the width value immediately. This won't work because the img.onload most likely won't be fired before the function finishes executing.

What you would need to do is in the onload event handler, put a call to another function, passing in the width value, and have that function do what you need to do when the image is loaded. Then you will know that at that point, the image is loaded and the width value is available.

OK try this. You have to return the value of window.imgwidth within the function test:

function find_image_dm(imgsrc){
    window.imgwidth = ""; 
    var img = new Image();
        img.onload = function test() {
        var width =this.width
        var height= this.height;
           if(height > 300){
               var x = height/300;
               console.log(Math.ceil(width/x));
               window.imgwidth = Math.ceil(width/x);
               console.log(window.imgwidth);
               alert (window.imgwidth);
               return window.imgwidth;
           }
        }

        img.src = imgsrc;
}

Ok. Another stab at this, @Tom.

There may be two issues here, from what I can see.

1. There will be no calculation of window.imgwidth if your if statement returns false, as this appears to be the only place you are calculating it.

2. The window.imgwidth is being calculated in function test() but not returned.

Looking at your code it seems the issue is you aren't technically loading the image before trying to get the height because you are setting the src after the the onload call.

If you are using jQuery you should try and leverage it.

function find_image(imgsrc) {

    var imgWidth,
        img = $('<img/>').attr('src', imgsrc).load(function() {

        var $img = $(this),
            height = $img.height(),
            width = $img.width();

        if (height > 300) {
            var x = height/300;
            imgWidth = Math.ceil(width/x);
        }

    });

    return imgWidth;

}

Ok... I went through your code and found a problem with your script. You are using image.onload function, so when u load image source, image loads and then only dimension are available and stored on the window.imgwidth.

All goes fine, but problem is, when u call the function, it takes time to load the u image, so if you try to get the window.imgwidth, as the resource is still loading you wont get the window.imgwidth. Return value also will not work as codes do not wait till the image loads so although the image is loading the code block execution will be completed so you wont have any data in window.imgwidth.

If you try to alert window.imgwidth after certain duration when image loading is completed then you can see that window.imgwidth has the value. And also you have the if block which stores the data in window.imgwidth only when the height more than 300 but you dont have else block so you need to implement that too as a fallback :) .

Let me know if i said it hard way :-D