MouseOver Image in Master Pages

Hi Experts !
I need some help please with using MouseOver on some images in my MasterPage
I have a button that I want to replace with different image when I do OnMouseOver and OnMouseOut.
Simple , right ?
So I did:
<asp:ImageButton ID="btnWeddings" runat="server" ImageUrl="~/Images/weddingBtn.gif" onmouseover="this.src='Images/weddingPressedBtn.gif';" onmouseout="this.src='Images/weddingBtn.gif';" OnClick="ImageButton4_Click"/>
It works as long as I stay on the same page.

Here is a problem... As soon as the MasterPage pulls content from another page OnMouseOver and OnMouseOut images break.
I tried using:
onmouseover="this.src='~/Images/weddingPressedBtn.gif';"
and
onmouseover="this.src='../Images/weddingPressedBtn.gif';"
But ~/ doesn't seem to work with events like OnMouseOver for some reason.
I also tried adding to the page load event:
        btnWeddings.Attributes.Add("OnMouseOver","this.src='~/Images/weddingPressedBtn.gif'");
It only works with direct path such as Images/.... breaking the whole thing if I pull content from another page.
Thank you in advance !
LVL 1
techsuppoprtAsked:
Who is Participating?

Improve company productivity with a Business Account.Sign Up

x
 
ventaurConnect With a Mentor Commented:
You almost had it with your code approach, but since onMouseOver is a client-side event, the "~" won't get translated correctly without some help. See below.
btnWeddings.Attributes.Add("onMouseOver", string.Format("this.src='{0}'", ResolveClientUrl("~/Images/weddingPressedBtn.gif")));

Open in new window

0
 
craskinCommented:
onmouseover="this.src='~/Images/weddingPressedBtn.gif';"

since this is essentially javascript, i don't think the ~ is going to act like it does in a purely .net postback event. if you place the entire url there, does it work? like this.src='http://mysite.com/images/...gif
0
 
techsuppoprtAuthor Commented:
Thanks your answers guys! Craskin, sorry using full URLs is not an option although I'm sure it would work.

Ventaur, it worked like a charm. Do you know of any good guide on the Internet where I can read about this ? Being new I want to understand what I'm doing... Not just copy/paste the code :)  I added points.
0
 
ventaurCommented:
Here are a couple of articles on paths in ASP.NET:
http://msdn2.microsoft.com/en-us/library/ms178116.aspx
http://www.aspnetpro.com/newsletterarticle/2003/11/asp200311kd_l/asp200311kd_l.asp

How to use client-side events in server-side controls:
http://support.microsoft.com/kb/318814/es

Injecting client-side code in ASP.NET (this one is more advanced for emitting JS code that you do not want to duplicate on the page, etc.):
http://msdn2.microsoft.com/en-us/library/aa478975.aspx

Resolving URLs:
http://www.pluralsight.com/blogs/fritz/archive/2006/02/06/18596.aspx
http://clipmarks.com/clipmark/6C2F8613-F6CA-4504-8BE1-FB23AC4D6C17/


Enjoy coding!
0
 
techsuppoprtAuthor Commented:
Thank you!
As always ExpertSexChange saves the day :)
0
Question has a verified solution.

Are you are experiencing a similar issue? Get a personalized answer when you ask a related question.

Have a better answer? Share it in a comment.

All Courses

From novice to tech pro — start learning today.