Question

I have this code:

 $jq('.pop-tip').click( function(event) {
        width = '';
        height = '';
        var img = new Image();
        img.onload = function() {
            width = 'width='+(this.width + 240);
            height = 'height='+(this.height + 360);              
        }
        img.src = 'http://www.domain.com/uploads/2011/10/dealoftheweek.jpg';        
        destination = $jq(this).attr('title');
        postPop = $jq(this).attr('href');
        alert ( width );
        window.open(postPop, 'tip_pop',''+ width +', '+ height +', scrollbars=0' ).focus();
        window.open(destination, '_parent','' );
        event.preventDefault();
)};

For some reason it only works with the alert() just above the window.open call why is this and how can i fix it?

Answer 1

It is because you are setting height and width in onload event which will occur only after image is totally loaded.
Putting an alert will let the image load completely, by the time you click alert’s ok, the image’s onload will get called and the values would be set. But if u remove that, the height and width values are not set and so it would not work.

you can fix this by calling rest of the code inside the onload event.