Go Premium for a chance to win a PS4. Enter to Win

x
  • Status: Solved
  • Priority: Medium
  • Security: Public
  • Views: 387
  • Last Modified:

mouseover event? need to change image for an ImageButton on mouseover

Hi experts --

I need to change my ImageUrl to something else (a different image) when the mouse is placed over an ImageButton.  What is a good way to do this?

Thanks in advance,

Dan
0
djhoen
Asked:
djhoen
1 Solution
 
AerosSagaCommented:
I believe using a css class is your best solution

Regards,

Aeros
0
 
jnhorstCommented:
Dan:

This may point you in the right direction:  I used a couple jpg files from the My Pictures/Sample Picture folder on my XP Pro box.  I put them in an Images folder on my test web application.  You can adjust the script below to follow your desires as for relative paths.  

Add the following within the <HEAD></HEAD> section of the HTML of your aspx page.  

<script language=javascript>
function changeImage(imgCtl, newImgPath)
{
                // this'll work in IE, but probably not well cross browser.
      var ctl = document.getElementById(imgCtl);
      ctl.src = newImgPath;
}
</script>

Then in Page_Load if Page.PostBack == false, add the following: (Image1 is the image control).

this.Image1.Attributes.Add("onmouseover", "javascript:changeImage('" + this.Image1.ID + "', 'Images/Sunset.jpg');");

John


0
 
shovavnikCommented:
jnhorst's solution is the right way to go.

Just so you understand his solution, keep in mind that asp.net does not throw events for mouse movement.  It would simply generate too many events on the server, and it would be very difficult to actually make use of the data.

Plus, the changing image is a totally client-side, presentation layer type of action.  Avoid sending the data to the server as much as possible.

So really the only reasonable way to do what you want is to make the change on the client, using javascript, as jnhorst demonstrated.
0
 
djhoenAuthor Commented:
Thanks a lot guys
0

Featured Post

What does it mean to be "Always On"?

Is your cloud always on? With an Always On cloud you won't have to worry about downtime for maintenance or software application code updates, ensuring that your bottom line isn't affected.

Tackle projects and never again get stuck behind a technical roadblock.
Join Now