Click here to Skip to main content
14,733,075 members
Please Sign up or sign in to vote.
3.67/5 (3 votes)
See more:
hii
i have a imagebutton on my aspx page and i want to change this image on mouse over event. i m unable to find mouseover intelligence for asp:ImageButton.
how can i do this..
i have tried...
<script language="javascript" type="text/javascript">
       function mouseOverImage() {
           document.getElementById("ImageButton1").src = "images/orange-round-button-th.png";
       }

       function mouseOutImage() {
           document.getElementById("ImageButton1").src = "images/blue.png";
       }
   </script>

<asp:ImageButton ID="ImageButton1" runat="server" Height="55px"              ImageUrl="~/images/blue.png"  onmouseover="mouseOverImage()"  onmouseout="mouseOutImage()" />


it works fine for html imagecontrol if i put id "img" in javascript
<img  id= "img" alt="image " Height="55px"  src="images/blue.png" onmouseover = "mouseOverImage()"  önmouseout="mouseOutImage()"/> 
Posted
Updated 20-Sep-11 20:50pm
v3
Comments
Bhakta barik 21-Jul-12 7:30am
   
sfdfsd
Member 13475102 11-Dec-17 5:42am
   
how to work this program

function mouseOverImage() {
            document.getElementById('<%= ImageButton1.ClientID %>').src = "images/orange-round-button-th.png";
        }
 
        function mouseOutImage() {
            document.getElementById('<%= ImageButton1.ClientID %>').src = "images/blue.png";
        }


Or you can use
<asp:ImageButton ID="ImageButton1" runat="server" 

                 ImageUrl="~/images/blue.png"

                 onmouseover="this.src='images/orange-round-button-th.png';"

                 onmouseout="this.src='images/blue.png';"

                  />
   
v2
Comments
choudhary.sumit 21-Sep-11 1:56am
   
dear
i got this error "The name 'ImageButton1' does not exist in the current context"
should i do some changes on imagebutton control source??
choudhary.sumit 21-Sep-11 2:00am
   
second one can now fire a shot!!
thanx alote
shakil0304003 21-Sep-11 2:41am
   
So, you can make my solution as answer :D
Member 8191039 16-Jul-12 13:16pm
   
onmouseover="this.src='images/orange-round-button-th.png';"
onmouseout="this.src='images/blue.png';"

So simple and it took me 2 days to find it!! Thank you
shakil0304003 27-Aug-12 2:44am
   
Welcome
aspx file
<asp:imagebutton id="imgBtn1" runat="server" imageurl="~/images/1.gif" borderwidth="0" xmlns:asp="#unknown"></asp:imagebutton>


//onpage load assign them attributes.
.aspx.cs
protected void Page_Load(object sender, EventArgs e)
{
imgBtn1.Attributes.Add("onmouseover", "this.src='images/3.gif'");
imgBtn1.Attributes.Add("onmouseout", "this.src='images/4.gif'");
}
   
   
<asp:ImageButton runat="server" Style="cursor: pointer;" ID="btnOptA" border="0"
                                                               ImageUrl="~/images/optionA-btn.png" OnClick="btnOptA_Click" BorderStyle="None"
                                                               BorderColor="Transparent" onmouseout="this.src='images/optionA-btn.png'" onmouseover="this.src='images/optionA-btn_hover.png'" />
   
Comments
Tim Corey 28-Jun-12 9:36am
   
Why are you posting an answer on a 9-month-old question when the OP already got an answer (didn't mark it but told the person the solution worked)? Your answer isn't any different from that answer except you didn't explain anything.

This content, along with any associated source code and files, is licensed under The Code Project Open License (CPOL)




CodeProject, 20 Bay Street, 11th Floor Toronto, Ontario, Canada M5J 2N8 +1 (416) 849-8900