asked on

Changing the Background image of an ImageButton

I have an image button, and I would like to change the background image of it on a Rollover

All I could find was the following:

.aspx file
<asp:imagebutton id="ibOne" runat="server" imageurl="~/images/1.gif" borderwidth="0"></asp:imagebutton>

.aspx.cs

protected void Page_Load(object sender, EventArgs e)
{
ibOne.Attributes.Add("onmouseover", "this.src='images/3o.gif'");
ibOne.Attributes.Add("onmouseout", "this.src='images/4.gif'");
}

How would I convert this so I can change the Background image and not the actual image itself?

OMC2000

.aspx.cs

protected void Page_Load(object sender, EventArgs e)
{
ibOne.Attributes.Add("onmouseover", ""this.style.backgroundImage='url(images/3o.gif)'");
ibOne.Attributes.Add("onmouseout", ""this.style.backgroundImage='url(images/4.gif)'");
}

directxBOB

ASKER

What would be the easiest way of achieving this form of CSS Background Image Switching? It Loads the full image, but simply moves it depending on the acton.

Now 100% sure how I adapt the above code to handle this.

#menu a {
background: url("button.gif") 0 0 no-repeat;
...
}
#menu a:hover {
background-position: -157px 0;
...
}
#menu a:active {
background-position: -314px 0;
...
}

OMC2000

It's a good idea, but if you need all browsers, check whether it works for all of them or not.

directxBOB

ASKER

I only need Internet explorer, and provided Caching is enabled it will function, this is specifically for an internal web support system. So how do I achieve the above with an image button, I tried adding it as an attribute but can't seem to get it working.

ASKER CERTIFIED SOLUTION

OMC2000

membership

This solution is only available to members.

To access this solution, you must be a member of Experts Exchange.

Start Free Trial