Monday, January 29, 2007

When we deal with images, say ImageButton, often we come across need to add image effects like highlighting. This can be done by setting onmouseover client-side event to load the highlighted image and onmouseout event to set back.

However, this requires the image path to be always absolute to the page location. A simple static function I use to overcome this problem takes in the ImageButton as ref object and takes in the relative path to the highlight image (for example, "~/images/myHighlight.gif"). Then I use the ResolveClientUrl method to my advantage to set the absolute path. Here is an example...

public static void ImageButtonHighlightImage(ref ImageButton imgBtn, string imgURL)

{

Image imgTemp = new Image();

imgTemp.ImageUrl = imgURL;

imgBtn.Attributes.Add("onmouseover", "this.src='" +

imgTemp.ResolveClientUrl(imgTemp.ImageUrl) +

"';");

imgBtn.Attributes.Add("onmouseout", "this.src='" +

imgBtn.ResolveClientUrl(imgBtn.ImageUrl) +

"';");

}



Love Coding!

No comments: