TextBox Background Color Change On Focus Using JQuery
In this tutorial i will explain how to TextBox Background Color Change On Focus Using JQuery.To achieve this we don’t have to write so much code, a few lines of code is efficient for this.
Design View:
<%@ Page Language="C#" AutoEventWireup="true" CodeFile="Default.aspx.cs" Inherits="_Default" %> <!DOCTYPE html> <html xmlns="http://www.w3.org/1999/xhtml"> <head id="Head1" runat="server"> <title>Hightechnology Tutorials</title> <script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.7.2/jquery.min.js"> </script> <script type="text/javascript"> $(document).ready(function () { $('INPUT[type="text"]').focus(function () { $(this).addClass("colors"); }); $('INPUT[type="text"]').blur(function () { $(this).removeClass("colors"); }); }); </script> <style type="text/css"> .colors { border: 1px solid black; background-color: #f7d0fb; } </style> </head> <body> <form id="Hightech" runat="server"> <div> <table> <tr> <td><b>Name:</b></td> <td><asp:TextBox ID="Name" runat="server"/></td> </tr> <tr> <td><b>Email:</b></td> <td><asp:TextBox ID="Email" runat="server"/></td> </tr> </table> </div> </form> </body> </html>