How to make image button has pressed effect?
I use asp .net image button to show a static jpeg file, How to make image button has pressed effect
This is what I have so far:
<asp:ImageButton ID="Login_Button" runat="server" onclick="Login_Button_Click" ImageUrl="~/Image/Login.jpg" />
How to remove red cross when ImageUrl not set?
.Login
{
height:50px;
width:100px;
margin: 5px;
background: url(Image/Login.jpg) no-repeat 0 0;
}
.Login:ho开发者_如何学运维ver
{
background: url(Image/Login_Pressed.jpg) no-repeat 0 0;
}
This might help with rollovers.
Or, this one would work if you only want it to change when you press the button, instead of when you mouseover it.
I'm not totally sure what you're asking...
Only Link button can do this without a invalid icon
<asp:LinkButton ID="Login_Button" runat="server" style="float:left;"
onclick="Login_Button_Click" CssClass="Login" />
To remove the "red x," you could reference a placeholder transparent gif. They're usually named something like "spacer.gif" or "pixel.gif" and they're just a single transparent pixel. They provide the valid reference when an image file is required but are very small and, of course, transparent. What you're seeing with the "red x" is the image button not being able to find the image file. When no file is referenced or when it can't be found, some browsers (IE) will show the red x.
<asp:ImageButton ID="Login_Button" runat="server" onclick="Login_Button_Click"
ImageUrl="~/Image/pixel.gif" />
Or, as you've answered your own question, you can switch to a LinkButton and go from there.
CSS is definitely the way to go if you want the button to react to mouse actions, and the CSS you provided appears to be valid. You might find, however, that some browsers don't interpret the :hover
pseudo class unless it's attached to an anchor
(link) tag. If you've had trouble getting the mouse actions to work correctly in some browsers when you use the ImageButton
, this is probably why.
精彩评论