Hover effect of Asp Dotnet Buttons

J

jack

Hi.. aaa... i tried a lot btu couldnt find on net,
Im trying to get the hover effect of the web button . but dont know how
to get this ..
Please help
Thanks Awaiting for the answer..
 
G

Guest

Hi.. aaa... i tried a lot btu couldnt find on net,
Im trying to get the hover effect of the web button . but dont know how
to get this ..


Take a look at CSS - Hover attribute.
 
J

jack

sorry this works very well with the other html contrls but i think that
this thing little tricky with webcontrol button..
 
G

Guest

sorry this works very well with the other html contrls but i think that
this thing little tricky with webcontrol button..

No, not at all - you can assign the webcontrol button a CSS class : )
 
P

Papanii Okai

What type of button are you using? If it is the asp:image button, you can
add the onmouseover and onmouseout attributes to it....
e.g. Hope this helps..
<asp:ImageButton ID="ImageButton2" runat="server"
ImageUrl="~/images/CancelButton.gif" CommandName="cancel"
OnCommand="buttonExecute
onmouseover="this.src='../images/CancelOverButton.gif';"
onmouseout="this.src='../images/CancelButton.gif';"/>

--Papanii
 
Joined
Jan 23, 2008
Messages
1
Reaction score
0
i'm using asp:Button control, but mouseover and mouseout attribtues doesn't work for me. any other idea?
 
Joined
Apr 24, 2008
Messages
1
Reaction score
0
Asp:Button

The best way to do it is the combination of css and skin for the asp:Button.

Example:

Assigning Class for Button:

.ButtonClass
{
background-image:url(button.gif);
background-repeat:no-repeat;
}
.ButtonClass:hover
{
background-image:url(buttonHover.gif);
background-repeat:no-repeat;
cursor:hand;
}

After assigning it to the css use the skin for asp:button and calling the css class of the button

<asp:Button runat="server" SkinId="ButtonSkin" CssClass="ButtonClass"/>

Enjoy! 8)
 
Joined
May 12, 2009
Messages
1
Reaction score
0
Another option would be to add the onmouseout and on mouseover on page load. That is what I often do to keep from needing multiple CSS's or bloating one CSS since I may have several of these buttons on a site. This is under the assuption you utilize the 'typical' javascript for hover effects.

Example code:
protected void Page_Load(object sender, EventArgs e)
{
this.btnSubmit.Attributes.Add("onmouseout", "MM_swapImgRestore()");
this.btnSubmit.Attributes.Add("onmouseover", "MM_swapImage('" + this.btnSubmit.ClientID + "','','Images/Submit_h.jpg',1)");
}

The following Javascript must be placed in between <head></head> tags of the html or included in js file. They aren't all needed but I utilize preload and hover affects on almost everypage so I include all of these on most of my projects.

<script type="text/javascript">
<!--
function MM_swapImgRestore() { //v3.0
var i,x,a=document.MM_sr; for(i=0;a&&i<a.length&&(x=a)&&x.oSrc;i++) x.src=x.oSrc;
}

function MM_preloadImages() { //v3.0
var d=document; if(d.images){ if(!d.MM_p) d.MM_p=new Array();
var i,j=d.MM_p.length,a=MM_preloadImages.arguments; for(i=0; i<a.length; i++)
if (a.indexOf("#")!=0){ d.MM_p[j]=new Image; d.MM_p[j++].src=a;}}
}

function MM_findObj(n, d) { //v4.01
var p,i,x; if(!d) d=document; if((p=n.indexOf("?"))>0&&parent.frames.length) {
d=parent.frames[n.substring(p+1)].document; n=n.substring(0,p);}
if(!(x=d[n])&&d.all) x=d.all[n]; for (i=0;!x&&i<d.forms.length;i++) x=d.forms[n];
for(i=0;!x&&d.layers&&i<d.layers.length;i++) x=MM_findObj(n,d.layers.document);
if(!x && d.getElementById) x=d.getElementById(n); return x;
}

function MM_swapImage() { //v3.0
var i,j=0,x,a=MM_swapImage.arguments; document.MM_sr=new Array; for(i=0;i<(a.length-2);i+=3)
if ((x=MM_findObj(a))!=null){document.MM_sr[j++]=x; if(!x.oSrc) x.oSrc=x.src; x.src=a[i+2];}
}
-->
</script>
 

Ask a Question

Want to reply to this thread or ask your own question?

You'll need to choose a username for the site, which only take a couple of moments. After that, you can post your question and our members will help you out.

Ask a Question

Members online

Forum statistics

Threads
473,744
Messages
2,569,484
Members
44,904
Latest member
HealthyVisionsCBDPrice

Latest Threads

Top