Javascript / jQuery help needed with MVC 2

[Spydermag68]

I have the following asp:Image

<asp:Image ID="Image2" runat="server" Height="90px" ImageUrl="~/Content/Images/Field_of_Dreams_4.jpg"/>

<div id="main"></div>
and my script is:

<script>
var getMain = $("#main");
var mainWidth = getMain.outerWidth(true) + 1;
$("#Image2").css( "width", mainWidth)
</script>

This script allows me to size the width of the image to the width of the <div id="main">
but if I resize the window the main gets resizes but the picture stays the same.

I would like the picture to resize on the fly without having to hit the refresh button.

Thanks!

 

[Markbnj]

Set up a handler for the resize event and calculate the image dimensions there.

http://api.jquery.com/resize/

 

[Spydermag68]

@Markbnj

Thanks for your help.
I was able to change the code to this and now when the browser winder changes the width of the image follows:

$(window).resize(function () {
   var p = $("#main");
   $("p:last").text("outerWidth:" + p.outerWidth() + " , outerWidth(true):" + p.outerWidth(true));

   var getMain = $("#main");
   var mainWidth = getMain.outerWidth(true) + 1;
   $("#Image2").css("width", mainWidth)
});