How to resize images by window.resize function?

Question

I actually know how to resize an image with responsive design. But, my problem is not simple. I'm using a scale width function of parent div to append width of image like this:

function OnImageLoad(evt){somthing....}
<div class="parent">
 <img style="left: 0px; top: -20px;" onload="OnImageLoad(event);" src="http://4.bp.blogspot.com/-pHWQ1Wp63GQ/Uk3TJLa9FbI/AAAAAAAAACg/_JUXOxweYY8/s1600/edu2.jpg" width="270" height="175">
</div>

Now, I want run event on image onload="OnImageLoad(envent);" again if window resizing:

$(window).resize(function(){ ??? });

Check my attached file : Link

Check fiddle : http://jsfiddle.net/h9DEF/2/

Help me to fix it. Thanks for your help.

Answer 1

You should be able to just call your OnImageLoad(event); function from within window.onresize like so:

window.onresize = function(event) { OnImageLoad(event); }

Or you can use jQuery (which simply wraps window.onresize):

$(window).on('resize', function(event) { OnImageLoad(event); });