Zooming with jQuery and CSS

<div dir="rtl" style="text-align: right;" trbidi="on"> <div class="separator" style="clear: both; text-align: center;"> <a href="http://2.bp.blogspot.com/-XCTV7-ks8wY/UoxFYT0YZDI/AAAAAAAAAMA/d_jW2JNMfIo/s1600/jquery_zoom.png" imageanchor="1" style="margin-left: 1em; margin-right: 1em;"><img border="0" height="94" src="http://2.bp.blogspot.com/-XCTV7-ks8wY/UoxFYT0YZDI/AAAAAAAAAMA/d_jW2JNMfIo/s1600/jquery_zoom.png" width="320" /></a></div> <div style="text-align: left;"> <span style="color: #1e1e1e; font-family: Muli, Helvetica, Arial, Georgia, 'Times New Roman'; font-size: 16px; line-height: 24px; text-align: justify;"><br /></span></div> <div style="text-align: left;"> <span style="color: #1e1e1e; font-family: Muli, Helvetica, Arial, Georgia, 'Times New Roman'; font-size: 16px; line-height: 24px; text-align: justify;"><br /></span></div> <div style="text-align: left;"> <span style="color: #1e1e1e; font-family: Muli, Helvetica, Arial, Georgia, 'Times New Roman'; font-size: 16px; line-height: 24px; text-align: justify;">In this post I want to explain about </span><span style="background-color: #c7f464; border: 0px none; font-family: Muli, Helvetica, Arial, Georgia, 'Times New Roman'; font-size: 16px; font-style: inherit; line-height: 24px; margin: 0px; outline: 0px; padding: 0px 2px; text-align: justify;">Text Zooming with jQuery and CSS</span><span style="color: #1e1e1e; font-family: Muli, Helvetica, Arial, Georgia, 'Times New Roman'; font-size: 16px; line-height: 24px; text-align: justify;">. This is basic level tutorial just changing style using jQuery script. It's simple use it for zooming website content. </span></div> <div style="text-align: left;"> <span style="color: #1e1e1e; font-family: Muli, Helvetica, Arial, Georgia, 'Times New Roman'; font-size: 16px; line-height: 24px; text-align: justify;"><br /></span></div> <br /> <div style="text-align: left;"> <b style="border: 0px none; color: #1e1e1e; font-family: Muli, Arial, 'Times New Roman', Times, Arial, serif; font-size: 15px; line-height: 24px; margin: 0px; outline: 0px; padding: 0px; text-align: start;">Javascript Code</b></div> <span style="color: #1e1e1e; font-family: Muli, Arial, 'Times New Roman', Times, Arial, serif; font-size: 15px; line-height: 24px; text-align: start;"><div style="text-align: left;"> Contains javascript code. $("#zoom").change(funtion(){}- <span style="background-color: #c7f464; border: 0px none; font-style: inherit; margin: 0px; outline: 0px; padding: 0px 2px;">zoom</span> is the id name of the select box. Using <span style="background-color: #c7f464; border: 0px none; font-style: inherit; margin: 0px; outline: 0px; padding: 0px 2px;">$("#zoom").val();</span> calling select box value. Applying style at<span style="background-color: #c7f464; border: 0px none; font-style: inherit; margin: 0px; outline: 0px; padding: 0px 2px;">$("#main").css </span></div> </span><br /> <div class="code" style="border: 2px dashed rgb(222, 222, 222); margin: 0px; outline: 0px; padding: 10px; text-align: start; width: 547px; word-wrap: break-word;"> <div style="font-family: Courier, monospace, 'Courier New'; font-size: 13px; line-height: 16px; text-align: left;"> <span style="border: 0px none; color: #990000; font-family: inherit; font-style: inherit; font-weight: inherit; margin: 0px; outline: 0px; padding: 0px;"><script</span> type="<span style="border: 0px none; color: #0b5394; font-family: inherit; font-style: inherit; font-weight: inherit; margin: 0px; outline: 0px; padding: 0px;">text/javascript</span>" src="<span style="border: 0px none; color: #0b5394; font-family: inherit; font-style: inherit; font-weight: inherit; margin: 0px; outline: 0px; padding: 0px;">http://ajax.googleapis.com/ajax/</span></div> <span style="border: 0px none; color: #0b5394; font-family: inherit; font-size: 13px; font-style: inherit; font-weight: inherit; line-height: 16px; margin: 0px; outline: 0px; padding: 0px;"><div style="text-align: left;"> <span style="border: 0px none; font-family: inherit; font-style: inherit; font-weight: inherit; margin: 0px; outline: 0px; padding: 0px;">libs/jquery/1.3.0/jquery.min.js</span>"<span style="border: 0px none; color: #990000; font-family: inherit; font-style: inherit; font-weight: inherit; margin: 0px; outline: 0px; padding: 0px;">></span><span style="border: 0px none; color: #990000; font-family: inherit; font-style: inherit; font-weight: inherit; margin: 0px; outline: 0px; padding: 0px;"></script></span></div> </span><span style="border: 0px none; color: #990000; font-family: inherit; font-size: 13px; font-style: inherit; font-weight: inherit; line-height: 16px; margin: 0px; outline: 0px; padding: 0px;"><div style="text-align: left;"> <span style="border: 0px none; font-family: inherit; font-style: inherit; font-weight: inherit; margin: 0px; outline: 0px; padding: 0px;"><script</span> type="<span style="border: 0px none; color: #0b5394; font-family: inherit; font-style: inherit; font-weight: inherit; margin: 0px; outline: 0px; padding: 0px;">text/javascript</span>"<span style="border: 0px none; font-family: inherit; font-style: inherit; font-weight: inherit; margin: 0px; outline: 0px; padding: 0px;">></span></div> </span><div style="font-family: Courier, monospace, 'Courier New'; font-size: 13px; line-height: 16px; text-align: left;"> $(<b style="border: 0px none; font-family: inherit; font-style: inherit; margin: 0px; outline: 0px; padding: 0px;">function<span style="border: 0px none; color: #0b5394; font-family: inherit; font-style: inherit; font-weight: inherit; margin: 0px; outline: 0px; padding: 0px;">() </span></b></div> <div style="border: 0px none; color: #0b5394; font-family: inherit; font-size: 13px; font-style: inherit; font-weight: inherit; line-height: 16px; margin: 0px; outline: 0px; padding: 0px; text-align: left;"> <b style="border: 0px none; font-family: inherit; font-style: inherit; margin: 0px; outline: 0px; padding: 0px;">{</b></div> <div style="text-align: left;"> <span style="font-family: Courier, monospace, 'Courier New'; font-size: 13px; line-height: 16px;"><br /></span></div> <b style="border: 0px none; font-family: inherit; font-size: 13px; font-style: inherit; line-height: 16px; margin: 0px; outline: 0px; padding: 0px;"><div style="text-align: left;"> <b style="border: 0px none; font-family: inherit; font-style: inherit; margin: 0px; outline: 0px; padding: 0px;"><span style="border: 0px none; color: #0b5394; font-family: inherit; font-style: inherit; font-weight: inherit; margin: 0px; outline: 0px; padding: 0px;">$(</span></b><span style="font-family: Courier, monospace, 'Courier New';">"</span><span style="border: 0px none; color: blue; font-family: inherit; font-style: inherit; font-weight: inherit; margin: 0px; outline: 0px; padding: 0px;">#zoom</span><span style="font-family: Courier, monospace, 'Courier New';">"</span><b style="border: 0px none; font-family: inherit; font-style: inherit; margin: 0px; outline: 0px; padding: 0px;"><span style="border: 0px none; color: #0b5394; font-family: inherit; font-style: inherit; font-weight: inherit; margin: 0px; outline: 0px; padding: 0px;">)</span></b><span style="font-family: Courier, monospace, 'Courier New';">.</span><b style="border: 0px none; font-family: inherit; font-style: inherit; margin: 0px; outline: 0px; padding: 0px;"><span style="border: 0px none; color: #a64d79; font-family: inherit; font-style: inherit; font-weight: inherit; margin: 0px; outline: 0px; padding: 0px;">change</span><span style="border: 0px none; color: #0b5394; font-family: inherit; font-style: inherit; font-weight: inherit; margin: 0px; outline: 0px; padding: 0px;">(</span></b><b style="border: 0px none; font-family: inherit; font-style: inherit; margin: 0px; outline: 0px; padding: 0px;">function<span style="border: 0px none; color: #0b5394; font-family: inherit; font-style: inherit; font-weight: inherit; margin: 0px; outline: 0px; padding: 0px;">() </span></b></div> </b><div style="border: 0px none; color: #0b5394; font-family: inherit; font-size: 13px; font-style: inherit; font-weight: inherit; line-height: 16px; margin: 0px; outline: 0px; padding: 0px; text-align: left;"> <b style="border: 0px none; font-family: inherit; font-style: inherit; margin: 0px; outline: 0px; padding: 0px;">{</b></div> <div style="text-align: left;"> <br /></div> <b style="border: 0px none; font-family: inherit; font-size: 13px; font-style: inherit; line-height: 16px; margin: 0px; outline: 0px; padding: 0px;"><div style="text-align: left;"> <b style="border: 0px none; font-family: inherit; font-style: inherit; margin: 0px; outline: 0px; padding: 0px;"><span style="border: 0px none; color: #073763; font-family: inherit; font-style: inherit; font-weight: inherit; margin: 0px; outline: 0px; padding: 0px;">var</span></b><span style="font-family: Courier, monospace, 'Courier New';"> </span><span style="border: 0px none; color: #cc0000; font-family: inherit; font-style: inherit; font-weight: inherit; margin: 0px; outline: 0px; padding: 0px;">size</span><span style="font-family: Courier, monospace, 'Courier New';"> = </span><b style="border: 0px none; color: #0b5394; font-family: inherit; font-style: inherit; margin: 0px; outline: 0px; padding: 0px;">$(this)</b><span style="font-family: Courier, monospace, 'Courier New';">.val();</span></div> </b><b style="border: 0px none; color: #0b5394; font-family: inherit; font-size: 13px; font-style: inherit; line-height: 16px; margin: 0px; outline: 0px; padding: 0px;"><div style="text-align: left;"> <b style="border: 0px none; font-family: inherit; font-style: inherit; margin: 0px; outline: 0px; padding: 0px;">$(</b><span style="font-family: Courier, monospace, 'Courier New';">"</span><span style="border: 0px none; color: blue; font-family: inherit; font-style: inherit; font-weight: inherit; margin: 0px; outline: 0px; padding: 0px;">#main</span><span style="font-family: Courier, monospace, 'Courier New';">"</span><b style="border: 0px none; font-family: inherit; font-style: inherit; margin: 0px; outline: 0px; padding: 0px;"><span style="border: 0px none; font-family: inherit; font-style: inherit; font-weight: inherit; margin: 0px; outline: 0px; padding: 0px;">)</span></b><span style="font-family: Courier, monospace, 'Courier New';">.</span><b style="border: 0px none; font-family: inherit; font-style: inherit; margin: 0px; outline: 0px; padding: 0px;"><span style="border: 0px none; color: #a64d79; font-family: inherit; font-style: inherit; font-weight: inherit; margin: 0px; outline: 0px; padding: 0px;">css</span><span style="border: 0px none; font-family: inherit; font-style: inherit; font-weight: inherit; margin: 0px; outline: 0px; padding: 0px;">(</span></b><span style="font-family: Courier, monospace, 'Courier New';">'font-size', </span><span style="border: 0px none; color: #cc0000; font-family: inherit; font-style: inherit; font-weight: inherit; margin: 0px; outline: 0px; padding: 0px;">size</span><span style="font-family: Courier, monospace, 'Courier New';">+'px');</span></div> </b><div style="text-align: left;"> <br /></div> <div style="border: 0px none; color: #0b5394; font-family: inherit; font-size: 13px; font-style: inherit; font-weight: inherit; line-height: 16px; margin: 0px; outline: 0px; padding: 0px; text-align: left;"> <b style="border: 0px none; font-family: inherit; font-style: inherit; margin: 0px; outline: 0px; padding: 0px;">return false;</b></div> <div style="border: 0px none; color: #0b5394; font-family: inherit; font-size: 13px; font-style: inherit; font-weight: inherit; line-height: 16px; margin: 0px; outline: 0px; padding: 0px; text-align: left;"> <b style="border: 0px none; font-family: inherit; font-style: inherit; margin: 0px; outline: 0px; padding: 0px;">});</b></div> <div style="border: 0px none; color: #0b5394; font-family: inherit; font-size: 13px; font-style: inherit; font-weight: inherit; line-height: 16px; margin: 0px; outline: 0px; padding: 0px; text-align: left;"> <b style="border: 0px none; font-family: inherit; font-style: inherit; margin: 0px; outline: 0px; padding: 0px;">});</b></div> <span style="border: 0px none; color: #990000; font-family: inherit; font-size: 13px; font-style: inherit; font-weight: inherit; line-height: 16px; margin: 0px; outline: 0px; padding: 0px;"><div style="text-align: left;"> <span style="font-family: inherit; font-style: inherit; font-weight: inherit;"></script></span></div> </span></div> <div style="border: 0px none; margin: 0px; outline: 0px; padding: 0px; text-align: start;"> <div style="text-align: left;"> <span style="color: #1e1e1e; font-family: Muli, Arial, 'Times New Roman', Times, Arial, serif; font-size: 15px; line-height: 24px;"><br /></span></div> <div style="text-align: left;"> <ins style="border: none; color: #1e1e1e; display: inline-table; font-family: inherit; font-size: 15px; font-style: inherit; font-weight: inherit; height: 15px; line-height: 24px; margin: 0px; outline: 0px; padding: 0px; position: relative; visibility: visible; width: 468px;"><ins id="aswift_2_anchor" style="border: none; display: block; font-family: inherit; font-style: inherit; font-weight: inherit; height: 15px; margin: 0px; outline: 0px; padding: 0px; position: relative; visibility: visible; width: 468px;"><iframe allowtransparency="true" frameborder="0" height="15" hspace="0" id="aswift_2" marginheight="0" marginwidth="0" name="aswift_2" scrolling="no" style="border-style: none; border-width: 0px; font-family: inherit; font-style: inherit; font-weight: inherit; left: 0px; margin: 0px; outline: 0px; padding: 0px; position: absolute; top: 0px;" vspace="0" width="468"></iframe></ins></ins></div> </div> <br /> <div style="text-align: left;"> <span style="color: #1e1e1e; font-family: Muli, Arial, 'Times New Roman', Times, Arial, serif; font-size: 15px; line-height: 24px;"><br /></span></div> <b style="border: 0px none; color: #1e1e1e; font-family: Muli, Arial, 'Times New Roman', Times, Arial, serif; font-size: 15px; line-height: 24px; margin: 0px; outline: 0px; padding: 0px; text-align: start;"><div style="text-align: left;"> <b style="border: 0px none; margin: 0px; outline: 0px; padding: 0px;">HTML Code</b></div> </b><span style="color: #1e1e1e; font-family: Muli, Arial, 'Times New Roman', Times, Arial, serif; font-size: 15px; line-height: 24px; text-align: start;"><div style="text-align: left;"> Contains HTML code. </div> </span><br /> <div class="code" style="border: 2px dashed rgb(222, 222, 222); margin: 0px; outline: 0px; padding: 10px; text-align: start; width: 547px; word-wrap: break-word;"> <div style="font-family: Courier, monospace, 'Courier New'; font-size: 13px; line-height: 16px; text-align: left;"> Zoom Text: </div> <div style="border: 0px none; color: orange; font-family: inherit; font-size: 13px; font-style: inherit; font-weight: inherit; line-height: 16px; margin: 0px; outline: 0px; padding: 0px; text-align: left;"> <select id="<b style="border: 0px none; font-family: inherit; font-style: inherit; margin: 0px; outline: 0px; padding: 0px;"><span style="border: 0px none; color: blue; font-family: inherit; font-style: inherit; font-weight: inherit; margin: 0px; outline: 0px; padding: 0px;">zoom</span></b>"></div> <div style="border: 0px none; color: orange; font-family: inherit; font-size: 13px; font-style: inherit; font-weight: inherit; line-height: 16px; margin: 0px; outline: 0px; padding: 0px; text-align: left;"> <option value=<span style="border: 0px none; color: blue; font-family: inherit; font-style: inherit; font-weight: inherit; margin: 0px; outline: 0px; padding: 0px;">"25"</span>><b style="border: 0px none; font-family: inherit; font-style: inherit; margin: 0px; outline: 0px; padding: 0px;"><span style="border: 0px none; color: black; font-family: inherit; font-style: inherit; font-weight: inherit; margin: 0px; outline: 0px; padding: 0px;">25</span></b> </option></div> <div style="border: 0px none; color: orange; font-family: inherit; font-size: 13px; font-style: inherit; font-weight: inherit; line-height: 16px; margin: 0px; outline: 0px; padding: 0px; text-align: left;"> <option value=<span style="border: 0px none; color: blue; font-family: inherit; font-style: inherit; font-weight: inherit; margin: 0px; outline: 0px; padding: 0px;">"50"</span>><b style="border: 0px none; font-family: inherit; font-style: inherit; margin: 0px; outline: 0px; padding: 0px;"><span style="border: 0px none; color: black; font-family: inherit; font-style: inherit; font-weight: inherit; margin: 0px; outline: 0px; padding: 0px;">50</span></b> </option></div> <div style="border: 0px none; color: orange; font-family: inherit; font-size: 13px; font-style: inherit; font-weight: inherit; line-height: 16px; margin: 0px; outline: 0px; padding: 0px; text-align: left;"> <option value=<span style="border: 0px none; color: blue; font-family: inherit; font-style: inherit; font-weight: inherit; margin: 0px; outline: 0px; padding: 0px;">"75"</span>><b style="border: 0px none; font-family: inherit; font-style: inherit; margin: 0px; outline: 0px; padding: 0px;"><span style="border: 0px none; color: black; font-family: inherit; font-style: inherit; font-weight: inherit; margin: 0px; outline: 0px; padding: 0px;">75</span></b> </option></div> <div style="border: 0px none; color: orange; font-family: inherit; font-size: 13px; font-style: inherit; font-weight: inherit; line-height: 16px; margin: 0px; outline: 0px; padding: 0px; text-align: left;"> <option value=<span style="border: 0px none; color: blue; font-family: inherit; font-style: inherit; font-weight: inherit; margin: 0px; outline: 0px; padding: 0px;">"100"</span>><b style="border: 0px none; font-family: inherit; font-style: inherit; margin: 0px; outline: 0px; padding: 0px;"><span style="border: 0px none; color: black; font-family: inherit; font-style: inherit; font-weight: inherit; margin: 0px; outline: 0px; padding: 0px;">100</span></b> </option></div> <div style="border: 0px none; color: orange; font-family: inherit; font-size: 13px; font-style: inherit; font-weight: inherit; line-height: 16px; margin: 0px; outline: 0px; padding: 0px; text-align: left;"> <option value=<span style="border: 0px none; color: blue; font-family: inherit; font-style: inherit; font-weight: inherit; margin: 0px; outline: 0px; padding: 0px;">"150"</span>><b style="border: 0px none; font-family: inherit; font-style: inherit; margin: 0px; outline: 0px; padding: 0px;"><span style="border: 0px none; color: black; font-family: inherit; font-style: inherit; font-weight: inherit; margin: 0px; outline: 0px; padding: 0px;">150</span></b> </option></div> <div style="border: 0px none; color: orange; font-family: inherit; font-size: 13px; font-style: inherit; font-weight: inherit; line-height: 16px; margin: 0px; outline: 0px; padding: 0px; text-align: left;"> <option value=<span style="border: 0px none; color: blue; font-family: inherit; font-style: inherit; font-weight: inherit; margin: 0px; outline: 0px; padding: 0px;">"200"</span>><b style="border: 0px none; color: black; font-family: inherit; font-style: inherit; margin: 0px; outline: 0px; padding: 0px;">200</b> </option></div> <div style="border: 0px none; color: orange; font-family: inherit; font-size: 13px; font-style: inherit; font-weight: inherit; line-height: 16px; margin: 0px; outline: 0px; padding: 0px; text-align: left;"> </select></div> <div style="text-align: left;"> <span style="font-family: Courier, monospace, 'Courier New'; font-size: 13px; line-height: 16px;"><br /></span></div> <div style="border: 0px none; color: #0b5394; font-family: inherit; font-size: 13px; font-style: inherit; font-weight: inherit; line-height: 16px; margin: 0px; outline: 0px; padding: 0px; text-align: left;"> <b style="border: 0px none; font-family: inherit; font-style: inherit; margin: 0px; outline: 0px; padding: 0px;"><div id="<span style="border: 0px none; color: blue; font-family: inherit; font-style: inherit; font-weight: inherit; margin: 0px; outline: 0px; padding: 0px;">main</span>"></b></div> <span style="font-family: Courier, monospace, 'Courier New'; font-size: 13px; line-height: 16px;"><div style="text-align: left;"> Website Content</div> </span><div style="border: 0px none; color: #0b5394; font-family: inherit; font-size: 13px; font-style: inherit; font-weight: inherit; line-height: 16px; margin: 0px; outline: 0px; padding: 0px; text-align: left;"> <b style="border: 0px none; font-family: inherit; font-style: inherit; margin: 0px; outline: 0px; padding: 0px;"></div></b></div> </div> <div style="text-align: left;"> <span style="color: #1e1e1e; font-family: Muli, Arial, 'Times New Roman', Times, Arial, serif; font-size: 15px; line-height: 24px; text-align: start;">Join testking to learn best web designing practices using expert </span><a href="http://www.test-king.com/exams/70-680.htm" rel="nofollow" style="border: 0px none; color: #176092; font-family: Muli, Arial, 'Times New Roman', Times, Arial, serif; font-size: 15px; line-height: 24px; margin: 0px; outline: 0px; padding: 0px; text-align: start; text-decoration: none;" target="_blank">testking 70-680</a><span style="color: #1e1e1e; font-family: Muli, Arial, 'Times New Roman', Times, Arial, serif; font-size: 15px; line-height: 24px; text-align: start;">study guides and </span><a href="http://www.test-king.com/exams/SY0-201.htm" rel="nofollow" style="border: 0px none; color: #176092; font-family: Muli, Arial, 'Times New Roman', Times, Arial, serif; font-size: 15px; line-height: 24px; margin: 0px; outline: 0px; padding: 0px; text-align: start; text-decoration: none;" target="_blank">testking SY0-201</a><span style="color: #1e1e1e; font-family: Muli, Arial, 'Times New Roman', Times, Arial, serif; font-size: 15px; line-height: 24px; text-align: start;"> design tutorials. Become expert with our</span><a href="http://www.test-king.com/exams/642-901.htm" rel="nofollow" style="border: 0px none; color: #176092; font-family: Muli, Arial, 'Times New Roman', Times, Arial, serif; font-size: 15px; line-height: 24px; margin: 0px; outline: 0px; padding: 0px; text-align: start; text-decoration: none;" target="_blank">testking 642-901</a><span style="color: #1e1e1e; font-family: Muli, Arial, 'Times New Roman', Times, Arial, serif; font-size: 15px; line-height: 24px; text-align: start;"> web designing course.</span></div> </div>

Zooming with jQuery and CSS

In this post I want to explain about  Text Zooming with jQuery and CSS . This is basic level tutorial just changing style using jQue...

مزيد من المعلومات »

PHP Ajax basic example

<div dir="rtl" style="text-align: right;" trbidi="on"> <div class="separator" style="clear: both; text-align: center;"> <a href="http://4.bp.blogspot.com/-XsuT26005sA/UorzHUrOE3I/AAAAAAAAAKQ/ECxpJRaQceY/s1600/ajax-basics.jpg" imageanchor="1" style="margin-left: 1em; margin-right: 1em;"><img border="0" height="153" src="http://4.bp.blogspot.com/-XsuT26005sA/UorzHUrOE3I/AAAAAAAAAKQ/ECxpJRaQceY/s320/ajax-basics.jpg" width="320" /></a></div> <div class="separator" style="clear: both; text-align: center;"> <br /></div> <div class="separator" style="clear: both; text-align: left;"> <br /></div> <div style="background-color: white; color: #666666; font-family: Ebrima, Arial, Helvetica, sans-serif; font-size: 14px; line-height: 24px; text-align: left;"> <strong>AJAX (Asynchronous JavaScript And XML). Ajax is the interrelated web development method used in client side web application development.</strong>By using ajax we can send data to web server without interrupting user, browser, display and also behavior of the current page. This type of data transfer is called as <strong>Asynchronous or Process in Background.</strong></div> <div style="background-color: white; color: #666666; font-family: Ebrima, Arial, Helvetica, sans-serif; font-size: 14px; line-height: 24px; text-align: justify;"> <span style="float: left; padding: 0px 6px 6px 0px; text-align: left;"><img alt="PHP Ajax Basic tutorial" src="http://www.webinfopedia.com/images/ajax-basic-tutorial.jpg" /></span></div> <div style="text-align: left;"> In Ajax all information like image, content or video whatever it may be all the data is retrieved in XMLHttp Request Object.</div> <br /> <div style="background-color: white; color: #666666; font-family: Ebrima, Arial, Helvetica, sans-serif; font-size: 14px; line-height: 24px; margin-top: 44px; text-align: justify;"> </div> <div style="text-align: left;"> <strong>Basic Ajax example:</strong></div> <div style="text-align: left;"> In this example I will explain you basic Ajax and PHP integration .</div> <br /> <div style="background-color: white; color: #666666; font-family: Ebrima, Arial, Helvetica, sans-serif; font-size: 14px; line-height: 24px; text-align: justify;"> </div> <div class="script" style="background-color: white; color: #666666; font-family: Ebrima, Arial, Helvetica, sans-serif; font-size: 14px; line-height: 24px; text-align: left;"> CREATE TABLE `demo`.`article` ( `id` INT NOT NULL AUTO_INCREMENT PRIMARY KEY , `category` VARCHAR( 10 ) NOT NULL , `title` VARCHAR( 255 ) NOT NULL , `link` VARCHAR( 255 ) NOT NULL ) ENGINE = MYISAM ;</div> <div style="text-align: left;"> <br /></div> <div style="text-align: left;"> <span style="color: #1e1e1e; font-family: Muli, Arial, 'Times New Roman', Times, Arial, serif; font-size: 15px; line-height: 24px;"> </span><a href="https://app.box.com/shared/21r5gsva0v" style="border: 0px none; color: #176092; font-family: Muli, Arial, 'Times New Roman', Times, Arial, serif; font-size: 15px; line-height: 24px; margin: 0px; outline: 0px; padding: 0px; text-decoration: none;">Download Script</a><span style="color: #1e1e1e; font-family: Muli, Arial, 'Times New Roman', Times, Arial, serif; font-size: 15px; line-height: 24px;"> </span></div> </div>

PHP Ajax basic example

AJAX (Asynchronous JavaScript And XML). Ajax is the interrelated web development method used in client side web application developm...

مزيد من المعلومات »

Jquery Validation with Regular Expressions.

<div dir="rtl" style="text-align: right;" trbidi="on"> <div class="separator" style="clear: both; text-align: center;"> <a href="http://2.bp.blogspot.com/-O5UGmm_O-7c/UorvcaE7axI/AAAAAAAAAKE/KIF8AI_23eU/s1600/jqueryvalidation.png" imageanchor="1" style="margin-left: 1em; margin-right: 1em;"><img border="0" height="94" src="http://2.bp.blogspot.com/-O5UGmm_O-7c/UorvcaE7axI/AAAAAAAAAKE/KIF8AI_23eU/s320/jqueryvalidation.png" width="320" /></a></div> <div style="text-align: left;"> <span style="color: #1e1e1e; font-family: Muli, Helvetica, Arial, Georgia, 'Times New Roman'; font-size: 16px; line-height: 24px; text-align: justify;"><br /></span></div> <div style="text-align: left;"> <span style="color: #1e1e1e; font-family: Muli, Helvetica, Arial, Georgia, 'Times New Roman'; font-size: 16px; line-height: 24px; text-align: justify;"><br /></span></div> <div style="text-align: left;"> <span style="color: #1e1e1e; font-family: Muli, Helvetica, Arial, Georgia, 'Times New Roman'; font-size: 16px; line-height: 24px; text-align: justify;">This time I want to explain about "Form validation using regular expressions with jquery". I had developed a tutorial using </span><span style="background-color: #c7f464; border: 0px none; font-family: Muli, Helvetica, Arial, Georgia, 'Times New Roman'; font-size: 16px; font-style: inherit; line-height: 24px; margin: 0px; outline: 0px; padding: 0px 2px; text-align: justify;">jquery.validate</span><span style="color: #1e1e1e; font-family: Muli, Helvetica, Arial, Georgia, 'Times New Roman'; font-size: 16px; line-height: 24px; text-align: justify;">plugin, It's very simple. Implement this and enrich your web projects.</span></div> <div style="text-align: left;"> <br /></div> <div> <div style="text-align: left;"> <span style="color: #1e1e1e; font-family: Muli, Arial, 'Times New Roman', Times, Arial, serif; font-size: 15px; line-height: 24px; text-align: start;">Book : </span><a href="http://www.amazon.com/jQuery-Visual-QuickStart-Steven-Holzner/dp/0321647491?ie=UTF8&tag=9lessons-20&link_code=btl&camp=213689&creative=392969" style="border: 0px none; color: #176092; font-family: Muli, Arial, 'Times New Roman', Times, Arial, serif; font-size: 15px; line-height: 24px; margin: 0px; outline: 0px; padding: 0px; text-align: start; text-decoration: none;" target="_blank">jQuery: Visual QuickStart Guide</a><img alt="" border="0" height="1" src="http://www.assoc-amazon.com/e/ir?t=9lessons-20&l=btl&camp=213689&creative=392969&o=1&a=0321647491" style="border: none !important; color: #1e1e1e; font-family: Muli, Arial, 'Times New Roman', Times, Arial, serif; font-size: 15px; line-height: 24px; margin: 0px !important; outline: 0px; padding: 0px; text-align: start;" width="1" /></div> <div style="text-align: left;"> <span style="color: #1e1e1e; font-family: Muli, Arial, 'Times New Roman', Times, Arial, serif; font-size: 15px; line-height: 24px;"><br /></span></div> <b style="border: 0px none; color: #1e1e1e; font-family: Muli, Arial, 'Times New Roman', Times, Arial, serif; font-size: 15px; line-height: 24px; margin: 0px; outline: 0px; padding: 0px; text-align: start;"><div style="text-align: left;"> <b style="border: 0px none; margin: 0px; outline: 0px; padding: 0px;">Javascript code</b></div> </b><div class="code" style="border: 2px dashed rgb(222, 222, 222); margin: 0px; outline: 0px; padding: 10px; text-align: start; width: 547px; word-wrap: break-word;"> <div style="font-family: Courier, monospace, 'Courier New'; font-size: 13px; line-height: 16px; text-align: left;"> <span style="border: 0px none; color: #990000; font-family: inherit; font-style: inherit; font-weight: inherit; margin: 0px; outline: 0px; padding: 0px;"><script</span> type="<span style="border: 0px none; color: #0b5394; font-family: inherit; font-style: inherit; font-weight: inherit; margin: 0px; outline: 0px; padding: 0px;">text/javascript</span>" src="<span style="border: 0px none; color: #0b5394; font-family: inherit; font-style: inherit; font-weight: inherit; margin: 0px; outline: 0px; padding: 0px;">http://ajax.googleapis.com/ajax/</span></div> <span style="border: 0px none; color: #0b5394; font-family: inherit; font-size: 13px; font-style: inherit; font-weight: inherit; line-height: 16px; margin: 0px; outline: 0px; padding: 0px;"><div style="text-align: left;"> <span style="border: 0px none; font-family: inherit; font-style: inherit; font-weight: inherit; margin: 0px; outline: 0px; padding: 0px;">libs/jquery/1.3.0/jquery.min.js</span>"<span style="border: 0px none; color: #990000; font-family: inherit; font-style: inherit; font-weight: inherit; margin: 0px; outline: 0px; padding: 0px;">></span><span style="border: 0px none; color: #990000; font-family: inherit; font-style: inherit; font-weight: inherit; margin: 0px; outline: 0px; padding: 0px;"></script></span></div> </span><span style="border: 0px none; color: #990000; font-family: inherit; font-size: 13px; font-style: inherit; font-weight: inherit; line-height: 16px; margin: 0px; outline: 0px; padding: 0px;"><div style="text-align: left;"> <span style="border: 0px none; font-family: inherit; font-style: inherit; font-weight: inherit; margin: 0px; outline: 0px; padding: 0px;"><script</span> type="<span style="border: 0px none; color: #0b5394; font-family: inherit; font-style: inherit; font-weight: inherit; margin: 0px; outline: 0px; padding: 0px;">text/javascript</span>" src="<span style="border: 0px none; color: #1010cc; font-family: inherit; font-style: inherit; font-weight: inherit; margin: 0px; outline: 0px; padding: 0px;"><b style="border: 0px none; font-family: inherit; font-style: inherit; margin: 0px; outline: 0px; padding: 0px;">jquery.validate.js</b></span>"<span style="border: 0px none; font-family: inherit; font-style: inherit; font-weight: inherit; margin: 0px; outline: 0px; padding: 0px;">></span><span style="border: 0px none; font-family: inherit; font-style: inherit; font-weight: inherit; margin: 0px; outline: 0px; padding: 0px;"></script></span></div> </span><span style="border: 0px none; color: #990000; font-family: inherit; font-size: 13px; font-style: inherit; font-weight: inherit; line-height: 16px; margin: 0px; outline: 0px; padding: 0px;"><div style="text-align: left;"> <span style="border: 0px none; font-family: inherit; font-style: inherit; font-weight: inherit; margin: 0px; outline: 0px; padding: 0px;"><script</span> type="<span style="border: 0px none; color: #0b5394; font-family: inherit; font-style: inherit; font-weight: inherit; margin: 0px; outline: 0px; padding: 0px;">text/javascript</span>" <span style="border: 0px none; font-family: inherit; font-style: inherit; font-weight: inherit; margin: 0px; outline: 0px; padding: 0px;">></span></div> </span><div style="font-family: Courier, monospace, 'Courier New'; font-size: 13px; line-height: 16px; text-align: left;"> $(<span style="border: 0px none; color: #a64d79; font-family: inherit; font-style: inherit; font-weight: inherit; margin: 0px; outline: 0px; padding: 0px;">document</span>).ready(<b style="border: 0px none; font-family: inherit; font-style: inherit; margin: 0px; outline: 0px; padding: 0px;">function</b>() {</div> <div style="font-family: Courier, monospace, 'Courier New'; font-size: 13px; line-height: 16px; text-align: left;"> $.validator.addMethod("<span style="border: 0px none; color: blue; font-family: inherit; font-style: inherit; font-weight: inherit; margin: 0px; outline: 0px; padding: 0px;">email</span>", <b style="border: 0px none; font-family: inherit; font-style: inherit; margin: 0px; outline: 0px; padding: 0px;">function</b>(value, element) </div> <div style="font-family: Courier, monospace, 'Courier New'; font-size: 13px; line-height: 16px; text-align: left;"> { </div> <b style="border: 0px none; font-family: inherit; font-size: 13px; font-style: inherit; line-height: 16px; margin: 0px; outline: 0px; padding: 0px;"><div style="text-align: left;"> <b style="border: 0px none; font-family: inherit; font-style: inherit; margin: 0px; outline: 0px; padding: 0px;"><span style="border: 0px none; color: #0b5394; font-family: inherit; font-style: inherit; font-weight: inherit; margin: 0px; outline: 0px; padding: 0px;">return this</span></b>.optional(element) || /^<span style="border: 0px none; color: #38761d; font-family: inherit; font-style: inherit; font-weight: inherit; margin: 0px; outline: 0px; padding: 0px;"><b style="border: 0px none; font-family: inherit; font-style: inherit; margin: 0px; outline: 0px; padding: 0px;">[a-zA-Z0-9._-]+@[a-zA-Z0-9-]+\.[a-zA-Z.]{<span style="border: 0px none; color: #cc0000; font-family: inherit; font-style: inherit; font-weight: inherit; margin: 0px; outline: 0px; padding: 0px;">2</span>,<span style="border: 0px none; color: #cc0000; font-family: inherit; font-style: inherit; font-weight: inherit; margin: 0px; outline: 0px; padding: 0px;">5</span>}</b></span>$/i.test(value); </div> </b><div style="font-family: Courier, monospace, 'Courier New'; font-size: 13px; line-height: 16px; text-align: left;"> }, "<span style="border: 0px none; color: #cc0000; font-family: inherit; font-style: inherit; font-weight: inherit; margin: 0px; outline: 0px; padding: 0px;">Please enter a valid email address.</span>");</div> <div style="text-align: left;"> <span style="font-family: Courier, monospace, 'Courier New'; font-size: 13px; line-height: 16px;"><br /></span></div> <span style="font-family: Courier, monospace, 'Courier New'; font-size: 13px; line-height: 16px;"><div style="text-align: left;"> $.validator.addMethod("<span style="border: 0px none; color: blue; font-family: inherit; font-style: inherit; font-weight: inherit; margin: 0px; outline: 0px; padding: 0px;">username</span>",<b style="border: 0px none; font-family: inherit; font-style: inherit; margin: 0px; outline: 0px; padding: 0px;">function</b>(value,element)</div> </span><span style="font-family: Courier, monospace, 'Courier New'; font-size: 13px; line-height: 16px;"><div style="text-align: left;"> {</div> </span><b style="border: 0px none; font-family: inherit; font-size: 13px; font-style: inherit; line-height: 16px; margin: 0px; outline: 0px; padding: 0px;"><div style="text-align: left;"> <b style="border: 0px none; font-family: inherit; font-style: inherit; margin: 0px; outline: 0px; padding: 0px;"><span style="border: 0px none; color: #0b5394; font-family: inherit; font-style: inherit; font-weight: inherit; margin: 0px; outline: 0px; padding: 0px;">return this</span></b><span style="font-family: Courier, monospace, 'Courier New';">.optional(element) || /^</span><span style="border: 0px none; color: #38761d; font-family: inherit; font-style: inherit; font-weight: inherit; margin: 0px; outline: 0px; padding: 0px;"><b style="border: 0px none; font-family: inherit; font-style: inherit; margin: 0px; outline: 0px; padding: 0px;">[a-zA-Z0-9._-]{<span style="border: 0px none; color: #cc0000; font-family: inherit; font-style: inherit; font-weight: inherit; margin: 0px; outline: 0px; padding: 0px;">3</span>,<span style="border: 0px none; color: #cc0000; font-family: inherit; font-style: inherit; font-weight: inherit; margin: 0px; outline: 0px; padding: 0px;">16</span>}</b></span><span style="font-family: Courier, monospace, 'Courier New';">$/i.test(value); </span></div> </b><span style="font-family: Courier, monospace, 'Courier New'; font-size: 13px; line-height: 16px;"><div style="text-align: left;"> },"<span style="border: 0px none; color: #cc0000; font-family: inherit; font-style: inherit; font-weight: inherit; margin: 0px; outline: 0px; padding: 0px;">Username are 3-15 characters</span>");</div> </span><div style="text-align: left;"> <br /></div> <span style="font-family: Courier, monospace, 'Courier New'; font-size: 13px; line-height: 16px;"><div style="text-align: left;"> $.validator.addMethod("<span style="border: 0px none; color: blue; font-family: inherit; font-style: inherit; font-weight: inherit; margin: 0px; outline: 0px; padding: 0px;">password</span>",<b style="border: 0px none; font-family: inherit; font-style: inherit; margin: 0px; outline: 0px; padding: 0px;">function</b>(value,element)</div> </span><span style="font-family: Courier, monospace, 'Courier New'; font-size: 13px; line-height: 16px;"><div style="text-align: left;"> {</div> </span><b style="border: 0px none; font-family: inherit; font-size: 13px; font-style: inherit; line-height: 16px; margin: 0px; outline: 0px; padding: 0px;"><div style="text-align: left;"> <b style="border: 0px none; font-family: inherit; font-style: inherit; margin: 0px; outline: 0px; padding: 0px;"><span style="border: 0px none; color: #0b5394; font-family: inherit; font-style: inherit; font-weight: inherit; margin: 0px; outline: 0px; padding: 0px;">return this</span></b><span style="font-family: Courier, monospace, 'Courier New';">.optional(element) || /^</span><span style="border: 0px none; color: #38761d; font-family: inherit; font-style: inherit; font-weight: inherit; margin: 0px; outline: 0px; padding: 0px;"><b style="border: 0px none; font-family: inherit; font-style: inherit; margin: 0px; outline: 0px; padding: 0px;">[A-Za-z0-9!@#$%^&*()_]{<span style="border: 0px none; color: #cc0000; font-family: inherit; font-style: inherit; font-weight: inherit; margin: 0px; outline: 0px; padding: 0px;">6</span>,<span style="border: 0px none; color: #cc0000; font-family: inherit; font-style: inherit; font-weight: inherit; margin: 0px; outline: 0px; padding: 0px;">16</span>}</b></span><span style="font-family: Courier, monospace, 'Courier New';">$/i.test(value); </span></div> </b><span style="font-family: Courier, monospace, 'Courier New'; font-size: 13px; line-height: 16px;"><div style="text-align: left;"> },"<span style="border: 0px none; color: #cc0000; font-family: inherit; font-style: inherit; font-weight: inherit; margin: 0px; outline: 0px; padding: 0px;">Passwords are 6-16 characters</span>");</div> </span><div style="text-align: left;"> <br /></div> <span style="border: 0px none; color: #b45f06; font-family: inherit; font-size: 13px; font-style: inherit; font-weight: inherit; line-height: 16px; margin: 0px; outline: 0px; padding: 0px;"><div style="text-align: left;"> <span style="font-family: inherit; font-style: inherit; font-weight: inherit;">// Validate signup form</span></div> </span><span style="font-family: Courier, monospace, 'Courier New'; font-size: 13px; line-height: 16px;"><div style="text-align: left;"> $(<span style="border: 0px none; color: blue; font-family: inherit; font-style: inherit; font-weight: inherit; margin: 0px; outline: 0px; padding: 0px;">"#signup"</span>).validate({</div> </span><span style="font-family: Courier, monospace, 'Courier New'; font-size: 13px; line-height: 16px;"><div style="text-align: left;"> rules: {</div> </span><span style="font-family: Courier, monospace, 'Courier New'; font-size: 13px; line-height: 16px;"><div style="text-align: left;"> email: "<span style="border: 0px none; color: blue; font-family: inherit; font-style: inherit; font-weight: inherit; margin: 0px; outline: 0px; padding: 0px;">required email</span>",</div> </span><span style="font-family: Courier, monospace, 'Courier New'; font-size: 13px; line-height: 16px;"><div style="text-align: left;"> username: "<span style="border: 0px none; color: blue; font-family: inherit; font-style: inherit; font-weight: inherit; margin: 0px; outline: 0px; padding: 0px;">required username</span>",</div> </span><span style="font-family: Courier, monospace, 'Courier New'; font-size: 13px; line-height: 16px;"><div style="text-align: left;"> password: "<span style="border: 0px none; color: blue; font-family: inherit; font-style: inherit; font-weight: inherit; margin: 0px; outline: 0px; padding: 0px;">required password</span>",</div> </span><span style="font-family: Courier, monospace, 'Courier New'; font-size: 13px; line-height: 16px;"><div style="text-align: left;"> },</div> </span><span style="font-family: Courier, monospace, 'Courier New'; font-size: 13px; line-height: 16px;"><div style="text-align: left;"> });</div> </span><span style="font-family: Courier, monospace, 'Courier New'; font-size: 13px; line-height: 16px;"><div style="text-align: left;"> });</div> </span><span style="border: 0px none; color: #990000; font-family: inherit; font-size: 13px; font-style: inherit; font-weight: inherit; line-height: 16px; margin: 0px; outline: 0px; padding: 0px;"><div style="text-align: left;"> <span style="font-family: inherit; font-style: inherit; font-weight: inherit;"></script></span></div> </span></div> <div style="border: 0px none; margin: 0px; outline: 0px; padding: 0px; text-align: start;"> <div style="text-align: left;"> <span style="color: #1e1e1e; font-family: Muli, Arial, 'Times New Roman', Times, Arial, serif; font-size: 15px; line-height: 24px;"><br /></span></div> <div style="text-align: left;"> <ins style="border: none; color: #1e1e1e; display: inline-table; font-family: inherit; font-size: 15px; font-style: inherit; font-weight: inherit; height: 15px; line-height: 24px; margin: 0px; outline: 0px; padding: 0px; position: relative; visibility: visible; width: 468px;"><ins id="aswift_2_anchor" style="border: none; display: block; font-family: inherit; font-style: inherit; font-weight: inherit; height: 15px; margin: 0px; outline: 0px; padding: 0px; position: relative; visibility: visible; width: 468px;"><iframe allowtransparency="true" frameborder="0" height="15" hspace="0" id="aswift_2" marginheight="0" marginwidth="0" name="aswift_2" scrolling="no" style="border-style: none; border-width: 0px; font-family: inherit; font-style: inherit; font-weight: inherit; left: 0px; margin: 0px; outline: 0px; padding: 0px; position: absolute; top: 0px;" vspace="0" width="468"></iframe></ins></ins></div> </div> <div style="text-align: left;"> <span style="color: #1e1e1e; font-family: Muli, Arial, 'Times New Roman', Times, Arial, serif; font-size: 15px; line-height: 24px;"><br /></span></div> <b style="border: 0px none; color: #1e1e1e; font-family: Muli, Arial, 'Times New Roman', Times, Arial, serif; font-size: 15px; line-height: 24px; margin: 0px; outline: 0px; padding: 0px; text-align: start;"><div style="text-align: left;"> <b style="border: 0px none; margin: 0px; outline: 0px; padding: 0px;">HTML code</b></div> </b><span style="color: #1e1e1e; font-family: Muli, Arial, 'Times New Roman', Times, Arial, serif; font-size: 15px; line-height: 24px; text-align: start;"><div style="text-align: left;"> Contains simple HTML code.</div> </span><div class="code" style="border: 2px dashed rgb(222, 222, 222); font-family: Courier, monospace, 'Courier New'; font-size: 13px; line-height: 16px; margin: 0px; outline: 0px; padding: 10px; text-align: start; width: 547px; word-wrap: break-word;"> <div style="text-align: left;"> <span style="border: 0px none; color: orange; font-family: inherit; font-style: inherit; font-weight: inherit; margin: 0px; outline: 0px; padding: 0px;"><form method="</span><span style="border: 0px none; color: blue; font-family: inherit; font-style: inherit; font-weight: inherit; margin: 0px; outline: 0px; padding: 0px;">post</span><span style="border: 0px none; color: orange; font-family: inherit; font-style: inherit; font-weight: inherit; margin: 0px; outline: 0px; padding: 0px;">" action="</span><span style="border: 0px none; color: blue; font-family: inherit; font-style: inherit; font-weight: inherit; margin: 0px; outline: 0px; padding: 0px;">thank.html</span><span style="border: 0px none; color: orange; font-family: inherit; font-style: inherit; font-weight: inherit; margin: 0px; outline: 0px; padding: 0px;">" name="</span><span style="border: 0px none; color: blue; font-family: inherit; font-style: inherit; font-weight: inherit; margin: 0px; outline: 0px; padding: 0px;">signup</span><span style="border: 0px none; color: orange; font-family: inherit; font-style: inherit; font-weight: inherit; margin: 0px; outline: 0px; padding: 0px;">" id="</span><span style="border: 0px none; color: blue; font-family: inherit; font-style: inherit; font-weight: inherit; margin: 0px; outline: 0px; padding: 0px;">signup</span><span style="border: 0px none; color: orange; font-family: inherit; font-style: inherit; font-weight: inherit; margin: 0px; outline: 0px; padding: 0px;">"></span></div> <b style="border: 0px none; font-family: inherit; font-style: inherit; margin: 0px; outline: 0px; padding: 0px;"><div style="text-align: left;"> <b style="border: 0px none; font-family: inherit; font-style: inherit; margin: 0px; outline: 0px; padding: 0px;">Email</b><br /></div> </b><span style="border: 0px none; color: orange; font-family: inherit; font-style: inherit; font-weight: inherit; margin: 0px; outline: 0px; padding: 0px;"><div style="text-align: left;"> <span style="border: 0px none; font-family: inherit; font-style: inherit; font-weight: inherit; margin: 0px; outline: 0px; padding: 0px;"><input type="</span><span style="border: 0px none; color: blue; font-family: inherit; font-style: inherit; font-weight: inherit; margin: 0px; outline: 0px; padding: 0px;">text</span><span style="border: 0px none; font-family: inherit; font-style: inherit; font-weight: inherit; margin: 0px; outline: 0px; padding: 0px;">" name="</span><span style="border: 0px none; color: blue; font-family: inherit; font-style: inherit; font-weight: inherit; margin: 0px; outline: 0px; padding: 0px;">email</span><span style="border: 0px none; font-family: inherit; font-style: inherit; font-weight: inherit; margin: 0px; outline: 0px; padding: 0px;">" id='</span><span style="border: 0px none; color: blue; font-family: inherit; font-style: inherit; font-weight: inherit; margin: 0px; outline: 0px; padding: 0px;">email</span><span style="border: 0px none; font-family: inherit; font-style: inherit; font-weight: inherit; margin: 0px; outline: 0px; padding: 0px;">'/></span><br /></div> </span><b style="border: 0px none; font-family: inherit; font-style: inherit; margin: 0px; outline: 0px; padding: 0px;"><div style="text-align: left;"> <b style="border: 0px none; font-family: inherit; font-style: inherit; margin: 0px; outline: 0px; padding: 0px;">UserName</b><br /></div> </b><span style="border: 0px none; color: orange; font-family: inherit; font-style: inherit; font-weight: inherit; margin: 0px; outline: 0px; padding: 0px;"><div style="text-align: left;"> <span style="border: 0px none; font-family: inherit; font-style: inherit; font-weight: inherit; margin: 0px; outline: 0px; padding: 0px;"><input type="</span><span style="border: 0px none; color: blue; font-family: inherit; font-style: inherit; font-weight: inherit; margin: 0px; outline: 0px; padding: 0px;">text</span><span style="border: 0px none; font-family: inherit; font-style: inherit; font-weight: inherit; margin: 0px; outline: 0px; padding: 0px;">" name="</span><span style="border: 0px none; color: blue; font-family: inherit; font-style: inherit; font-weight: inherit; margin: 0px; outline: 0px; padding: 0px;">username</span><span style="border: 0px none; font-family: inherit; font-style: inherit; font-weight: inherit; margin: 0px; outline: 0px; padding: 0px;">" id="</span><span style="border: 0px none; color: blue; font-family: inherit; font-style: inherit; font-weight: inherit; margin: 0px; outline: 0px; padding: 0px;">username</span><span style="border: 0px none; font-family: inherit; font-style: inherit; font-weight: inherit; margin: 0px; outline: 0px; padding: 0px;">" /></span><br /></div> </span><b style="border: 0px none; font-family: inherit; font-style: inherit; margin: 0px; outline: 0px; padding: 0px;"><div style="text-align: left;"> <b style="border: 0px none; font-family: inherit; font-style: inherit; margin: 0px; outline: 0px; padding: 0px;">Password</b><br /></div> </b><span style="border: 0px none; color: orange; font-family: inherit; font-style: inherit; font-weight: inherit; margin: 0px; outline: 0px; padding: 0px;"><div style="text-align: left;"> <span style="border: 0px none; font-family: inherit; font-style: inherit; font-weight: inherit; margin: 0px; outline: 0px; padding: 0px;"><input type="</span><span style="border: 0px none; color: blue; font-family: inherit; font-style: inherit; font-weight: inherit; margin: 0px; outline: 0px; padding: 0px;">password</span><span style="border: 0px none; font-family: inherit; font-style: inherit; font-weight: inherit; margin: 0px; outline: 0px; padding: 0px;">" name="</span><span style="border: 0px none; color: blue; font-family: inherit; font-style: inherit; font-weight: inherit; margin: 0px; outline: 0px; padding: 0px;">password</span><span style="border: 0px none; font-family: inherit; font-style: inherit; font-weight: inherit; margin: 0px; outline: 0px; padding: 0px;">" id="</span><span style="border: 0px none; color: blue; font-family: inherit; font-style: inherit; font-weight: inherit; margin: 0px; outline: 0px; padding: 0px;">password</span><span style="border: 0px none; font-family: inherit; font-style: inherit; font-weight: inherit; margin: 0px; outline: 0px; padding: 0px;">" /></span><br /></div> </span><span style="border: 0px none; color: orange; font-family: inherit; font-style: inherit; font-weight: inherit; margin: 0px; outline: 0px; padding: 0px;"><div style="text-align: left;"> <span style="border: 0px none; font-family: inherit; font-style: inherit; font-weight: inherit; margin: 0px; outline: 0px; padding: 0px;"><input type="</span><span style="border: 0px none; color: blue; font-family: inherit; font-style: inherit; font-weight: inherit; margin: 0px; outline: 0px; padding: 0px;">submit</span><span style="border: 0px none; font-family: inherit; font-style: inherit; font-weight: inherit; margin: 0px; outline: 0px; padding: 0px;">" value=" </span><span style="border: 0px none; color: blue; font-family: inherit; font-style: inherit; font-weight: inherit; margin: 0px; outline: 0px; padding: 0px;">Sign-UP</span><span style="border: 0px none; font-family: inherit; font-style: inherit; font-weight: inherit; margin: 0px; outline: 0px; padding: 0px;"> " name='</span><span style="border: 0px none; color: blue; font-family: inherit; font-style: inherit; font-weight: inherit; margin: 0px; outline: 0px; padding: 0px;">SUBMIT</span><span style="border: 0px none; font-family: inherit; font-style: inherit; font-weight: inherit; margin: 0px; outline: 0px; padding: 0px;">' id="</span><span style="border: 0px none; color: blue; font-family: inherit; font-style: inherit; font-weight: inherit; margin: 0px; outline: 0px; padding: 0px;">SUBMIT</span><span style="border: 0px none; font-family: inherit; font-style: inherit; font-weight: inherit; margin: 0px; outline: 0px; padding: 0px;">"/></span></div> </span><span style="border: 0px none; color: orange; font-family: inherit; font-style: inherit; font-weight: inherit; margin: 0px; outline: 0px; padding: 0px;"><div style="text-align: left;"> <span style="font-family: inherit; font-style: inherit; font-weight: inherit;"></form></span></div> </span></div> <div style="text-align: left;"> <span style="color: #1e1e1e; font-family: Muli, Arial, 'Times New Roman', Times, Arial, serif; font-size: 15px; line-height: 24px;"><br /></span></div> <b style="border: 0px none; color: #1e1e1e; font-family: Muli, Arial, 'Times New Roman', Times, Arial, serif; font-size: 15px; line-height: 24px; margin: 0px; outline: 0px; padding: 0px; text-align: start;"><div style="text-align: left;"> <b style="border: 0px none; margin: 0px; outline: 0px; padding: 0px;">CSS code</b></div> </b><div class="code" style="border: 2px dashed rgb(222, 222, 222); font-family: Courier, monospace, 'Courier New'; font-size: 13px; line-height: 16px; margin: 0px; outline: 0px; padding: 10px; text-align: start; width: 547px; word-wrap: break-word;"> <div style="text-align: left;"> <b style="border: 0px none; font-family: inherit; font-style: inherit; margin: 0px; outline: 0px; padding: 0px;"><span style="border: 0px none; color: #a64d79; font-family: inherit; font-style: inherit; font-weight: inherit; margin: 0px; outline: 0px; padding: 0px;">body</span></b></div> <div style="text-align: left;"> {</div> <div style="text-align: left;"> font-family:Arial, Helvetica, sans-serif;</div> <div style="text-align: left;"> font-size:13px;</div> <div style="text-align: left;"> }</div> <b style="border: 0px none; font-family: inherit; font-style: inherit; margin: 0px; outline: 0px; padding: 0px;"><div style="text-align: left;"> <b style="border: 0px none; font-family: inherit; font-style: inherit; margin: 0px; outline: 0px; padding: 0px;"><span style="border: 0px none; color: #a64d79; font-family: inherit; font-style: inherit; font-weight: inherit; margin: 0px; outline: 0px; padding: 0px;">input</span></b></div> </b><div style="text-align: left;"> {</div> <div style="text-align: left;"> width:220px;</div> <div style="text-align: left;"> height:25px;</div> <div style="text-align: left;"> font-size:13px;</div> <div style="text-align: left;"> margin-bottom:10px;</div> <div style="text-align: left;"> border:solid 1px #333333;</div> <div style="text-align: left;"> }</div> <span style="border: 0px none; color: #a64d79; font-family: inherit; font-style: inherit; font-weight: inherit; margin: 0px; outline: 0px; padding: 0px;"><div style="text-align: left;"> <b style="border: 0px none; font-family: inherit; font-style: inherit; margin: 0px; outline: 0px; padding: 0px;">label.error </b></div> </span><div style="text-align: left;"> {</div> <div style="text-align: left;"> font-size:11px;</div> <div style="text-align: left;"> background-color:#cc0000;</div> <div style="text-align: left;"> color:#FFFFFF;</div> <div style="text-align: left;"> padding:3px;</div> <div style="text-align: left;"> margin-left:5px;</div> <div style="text-align: left;"> -moz-border-radius: 4px;</div> <div style="text-align: left;"> -webkit-border-radius: 4px; </div> <div style="text-align: left;"> }</div> </div> <span style="color: #1e1e1e; font-family: Muli, Arial, 'Times New Roman', Times, Arial, serif; font-size: 15px; line-height: 24px; text-align: start;"><div style="text-align: left;"> Book :<a href="http://www.amazon.com/jQuery-Cookbook-Animal-Guide-Lindley/dp/0596159773?ie=UTF8&tag=9lessons-20&link_code=btl&camp=213689&creative=392969" style="border: 0px none; color: #176092; margin: 0px; outline: 0px; padding: 0px; text-decoration: none;" target="_blank">jQuery Cookbook (Animal Guide)</a><img alt="" border="0" height="1" src="http://www.assoc-amazon.com/e/ir?t=9lessons-20&l=btl&camp=213689&creative=392969&o=1&a=0596159773" style="border: none !important; margin: 0px !important; outline: 0px; padding: 0px;" width="1" /></div> </span><div style="text-align: left;"> <span style="color: #1e1e1e; font-family: Muli, Arial, 'Times New Roman', Times, Arial, serif; font-size: 15px; line-height: 24px;"><br /></span></div> <div style="text-align: left;"> <span style="color: #1e1e1e; font-family: Muli, Arial, 'Times New Roman', Times, Arial, serif; font-size: 15px; line-height: 24px;"><br /></span></div> <span style="color: #1e1e1e; font-family: Muli, Arial, 'Times New Roman', Times, Arial, serif; font-size: 15px; line-height: 24px; text-align: start;"><div style="text-align: left;"> No matter looking for PHP tutorials or want to learn jQuery validate plugins for your web project, using our <a href="http://www.test-king.com/exams/1Y0-A17.htm" rel="nofollow" style="border: 0px none; color: #176092; margin: 0px; outline: 0px; padding: 0px; text-decoration: none;" target="_blank">testking 1Y0-A17</a> live demos and <a href="http://www.test-king.com/exams/PMI-001.htm" rel="nofollow" style="border: 0px none; color: #176092; margin: 0px; outline: 0px; padding: 0px; text-decoration: none;" target="_blank">testking PMI-001</a> study guides you can become expert in days. Join the <a href="http://www.test-king.com/exams/70-646.htm" rel="nofollow" style="border: 0px none; color: #176092; margin: 0px; outline: 0px; padding: 0px; text-decoration: none;" target="_blank">testking 70-646</a> online training to learn best tips and techniques in web designing.</div> </span></div> </div>

Jquery Validation with Regular Expressions.

This time I want to explain about "Form validation using regular expressions with jquery". I had developed a tutorial usin...

مزيد من المعلومات »