JQuery script to get nice style on a button

By Sateesh Arveti Jul 02, 2010
Below script gives nice mouseover effect for a button

   <style type="text/css">
            color: black;
            font: bold 95% 'trebuchet ms' ,helvetica,sans-serif;
            background-color: white;
            border: 1px solid;
            border-color: #696 #363 #363 #696;
            filter: progid:DXImageTransform.Microsoft.Gradient (GradientType=0,StartColorStr= 'white' ,EndColorStr= '#ffeeddaa' );
            background-color: orange;
            font: bold 95% 'trebuchet ms' ,helvetica,sans-serif;
            filter: progid:DXImageTransform.Microsoft.Gradient (GradientType=0,StartColorStr= 'orange' ,EndColorStr= 'orange' );
            border: 1px solid;
            border-color: #696 #363 #363 #696;
            color: White;

<script type="text/javascript">
        $(function() {
            $('input[type="button"]').attr('class', 'btn');
            $('input[type="button"]').mouseover(function() { $(this).attr('class', 'btnhov'); });
            $('input[type="button"]').mouseout(function() { $(this).attr('class', 'btn'); });

Sateesh Arveti

I hold Bachelors degree in Computer Science along with MCSD,MCTS and MVP for the year 2009. Areas of Interest: C#, WPF, WF, silverlight, ASP.NET, Oracle and SQL Server.