image button hover in ASP.NET image button control


When you would like to change the image in an image button when the user hovers over it

add the following to your control code

you can add the onmouseover and onmouseout using the Attributes property of the ImageButton:

ImageButton button = newImageButton(); 
button.ImageUrl = <your url>; 
button.Attributes.Add("onmouseover", "javascript:this.src='<your url>'"); 
button.Attributes.Add("onmouseout", "javascript:this.src='<your url>'");

Remember you need to refer to a server url for the ImageUrl property and a relative url for the Attributes

Kind Regards,

Swadesh

Enhanced by Zemanta

2 thoughts on “image button hover in ASP.NET image button control

  1. I’ve been looking for hours for this, finally it works Thank you! I tried using imagebutton to have a hover effect of the button but it didn’t seem to work. I put the file in a Folder called images but the actual aspx file was in another file called List so I thought I could just do this.src = ‘./images/abc.png'” but it never worked so I took this, put the image files in the same folder and it finally worked. Still confused as to how to get the javascript to call images from another folder.

    1. I found out the issue. javascript:this.src=’./image-files/abc.png’ this not work since its not pointing to the correct folder. Actually its javascript:this.src=’../image-files/abc.png’ the double dot brings the current location back a folder. For the ImageURL is seems to be able to see from the top up so for instance imageButton.ImageURL = “~/A/image-files/abc.png” works but for the javascript you have to take into relevance the actual location you are current at.

Leave a Reply

Fill in your details below or click an icon to log in:

WordPress.com Logo

You are commenting using your WordPress.com account. Log Out / Change )

Twitter picture

You are commenting using your Twitter account. Log Out / Change )

Facebook photo

You are commenting using your Facebook account. Log Out / Change )

Google+ photo

You are commenting using your Google+ account. Log Out / Change )

Connecting to %s