Change style of button during mouse hover event in asp.net

Total Post:45

Points:315
C# 
 1426  View(s)
Ratings:
Rate this:

I want to change the shape/style of button during mouse hover in asp.net. Actually i want to make the button circular during mouse hover in asp.net.

  1. Post:135

    Points:947
    Re: Change style of button during mouse hover event in asp.net

    Generally, you would do this with the CSS :hover pseudo-class: 

    a { /* define normal styles here */ } 

    a:hover { /* define hover styles here */ }

    To achieve a circular button, you could use a graphic image. Assuming you had a transparent PNG called circle.png in your images directory, you could do something like this: 

    a:hover {
      background: url('images/circle.png') no-repeat;
    }

    You could also set the border radius of the button to be one-half of the button height and width (which should be the same): 

    a:hover {
      height: 50px;
      width: 50px;
      border-radius: 25px;
    }

      Modified On Apr-07-2018 03:28:11 AM
  1. Post:108

    Points:756
    Re: Change style of button during mouse hover event in asp.net

    Create two Images for button. Then implement this css. 

    .blueButton
    {  
         background:url('../Images/btnBackground.png');         
         border:0;
    }
    .blueButton:hover

       background:url('../Images/btnBackground_circular.png');  
    }
    <input id="Button1" type="button" class="blueButton" value="button" />

      Modified On Apr-07-2018 03:27:11 AM

Answer

NEWSLETTER

Enter your email address here always to be updated. We promise not to spam!