onmouseover in asp:imagebutton

Hi everyone,

I want to change the image of the <asp:imagebutton> when mouse comes
over the button and when it goes away. Is there any way I can do it.

Any help will be graetly appreciated.


2/25/2004 6:29:59 AM
📁 asp.net.client-side
📃 24353 articles.

💬 5 Replies

the following is a code example of how to do this:

<asp:ImageButton id="ImageButton1" onmouseover="this.src='button2.gif'" onclick="ImageButton1_click" onmouseout="this.src='button1.gif'" runat="server" ImageUrl="button1.gif"></asp:ImageButton>
here button1.gif is the original image, where button2.gif is the picture shown on mouse over.
hope this helps.
2/25/2004 3:37:29 PM
Im not positive, but I think the imagebutton is rendered as an html image with an onclick event. So you should be able to do something like the following.

Dim img as ImageButton
ImageButton.ID = "myImgButton"
ImageButton.Attributes.Add("onmouseover", "changeImage(this, event, 'imageurl.gif')")
ImageButton.Attributes.Add("onmouseout", "changeImage(this, event, 'imageurl2.gif')")
then write a javascript function
changeImage(caller, events, imgURL){
caller.src = imgURL;
I will try to check this, but I think it should be close.
2/25/2004 4:32:27 PM
Thanks everyone. Code is working now

2/26/2004 2:40:56 AM

Copy and paste the below code on Page Load Event .....
Make sure u have added an ImageButton and set the imageurl to open a Picture
When you move your mouse over the picture(image) you will see the image changes to another image
Map1.gif and Map.gif are two different picuters that i added u can add ur own pictures in that ....
 ImageButton1.Attributes.Add("onmouseover", "this.src='images/map1.gif'");
 ImageButton1.Attributes.Add("onmouseout", "this.src='images/map.gif'");

9/26/2008 4:48:50 AM

Wow Siva,
Thank you very much for your post it worked like a charm.
 I am myself new to using ASP.NET, Althought I Like to work in Visual Basic not Csharp.  Your tip helped even me tackle and solve this problem.  I have Visual Studios 2005. I see it as a Godsend for makeing dynamic webpages quickly and yet still be full featured.
I am afraid I am a little ignoratin on object oriented language right now. can someone explain whats going on here? Can other Javascript attributes be added this way?
5/5/2009 6:49:57 AM