aspx Tutorial

NET Articles,jQuery demo, asp.net with jQuery, online tutorial,Jquery, SilverLight, Javascript, asp.net,JSON, MVC,.NET Articles,demo, Web Services,
Advertise Here

Toolbar

Get our toolbar!

Advertize



{#advanced_dlg.about_title}
by Aamir Hasan   on Friday, January 14, 2011
The jQuery Format Currency Plugin is a simple to format currency of any number. More
{#advanced_dlg.about_title}
by Aamir Hasan   on Sunday, January 2, 2011
In this article you will see that how to load web user control dynamically using jQuery. More
{#advanced_dlg.about_title}
by Aamir Hasan   on Tuesday, December 21, 2010
The following example demonstrates how can we count the number of rows in a table using jQuery.. More
{#advanced_dlg.about_title}
by Aamir Hasan   on Friday, November 12, 2010
how to display/hide div element with fading effect using jQuery 1.4.4 More
{#advanced_dlg.about_title}
by Aamir Hasan   on Friday, November 12, 2010
jQuery 1.4.4 is out. Now you can Add jQuery 1.4.4 in your web project. More
{#advanced_dlg.about_title}
by Aamir Hasan   on Wednesday, November 10, 2010
how to pass value from code behind to javascript. More
{#advanced_dlg.about_title}
by Aamir Hasan   on Wednesday, November 10, 2010
how to pass javascript value to server side. More
{#advanced_dlg.about_title}
by Aamir Hasan   on Sunday, November 7, 2010
A simple toggle event method on div layer using jQuery More
{#advanced_dlg.about_title}
by Aamir Hasan   on Thursday, November 4, 2010
Normal 0 false false false EN-US X-NONE X-NONE MicrosoftInternetExplorer4 There are lots of factor’s you have to see when you are going to design a website. Website should be human readable and interact the site so user will spend more time on your website. Style is also one big factor of your web site to interact the users. Website should be human readable. In this example I have create a simple form style, when you focus on input text box, jQuery focus event will add CSS class on focus textbox. Here’s an example <html xmlns="http://www.w3.org/1999/xhtml"><head id="Head1" runat="server">    <title>Change style effect on Input form using jQuery</title>    <style type="text/css">        html,body,table        {            font-family: Verdana;            font-size: 12px;        }        h2        {            font-size: 1.5em;            line-height: 1em;        }        input        {            background-color: #f9f9f9;            border: 1px solid #eee;            color: #999;        }        .add-focus        {            border: 1px solid #eaeaea;            background-color: White;            color: #666;        }    </style>    <script src="http://code.jquery.com/jquery-1.4.3.min.js" type="text/javascript"></script>    <script language="javascript">        $(document).ready(function () {            $('input[type="text"]').focus(function () {                $(this).addClass("add-focus");            });            $('input[type="text"]').blur(function () {                $(this).removeClass("add-focus");            });        });       </script></head><body>    <form id="form1" runat="server">    <div>        <h2>            Change style effect on Input form using jQuery        </h2>        <p>            <table width="500" border="0" cellspacing="0" cellpadding="0">                <tr>                    <th width="150" height="25" align="left" valign="top" scope="col">                        Username:                    </th>                    <th width="350" height="25" align="left" valign="top" scope="col">                        <asp:TextBox ID="tbUsername" runat="server" />                    </th>                </tr>                <tr>                    <th height="25" align="left" valign="top" scope="col">                        Email:                    </th>                    <th height="25" align="left" valign="top" scope="col">                        <asp:TextBox ID="tbEmail" runat="server" />                    </th>                </tr>                <tr>                    <th height="25" align="left" valign="top" scope="col">                        Password:                    </th>                    <th height="25" align="left" valign="top" scope="col">                        <asp:TextBox ID="tbpassword" runat="server" TextMode="Password" />                    </th>                </tr>                <tr>                    <th height="25" align="left" valign="top" scope="col">                        Retype password:                    </th>                    <th height="25" align="left" valign="top" scope="col">                        <asp:TextBox ID="tbRpassword" runat="server" TextMode="Password" />                    </th>                </tr>                <tr>                    <th height="25" align="left" valign="top" scope="col">                        &nbsp;                    </th>                    <th height="25" align="left" valign="top" scope="col">                        <input id="btSubmit" type="button" value="Submit" />                    </th>                </tr>            </table>        </p>    </div>    </form></body></html> Output Download FormStyle.zip (1.21 kb) Live demo
{#advanced_dlg.about_title}
by Aamir Hasan   on Tuesday, November 2, 2010
how to detect mouse x and y axis on the page... More
Advertizement 1
Advertizement 2
Advertizement 3
Advertizement 4
Advertizement 5