How to do partial page updates using Jquery and Ajax?

<div dir="ltr" style="text-align: left;" trbidi="on"> <b><u><span style="background: white; font-family: "Verdana","sans-serif"; font-size: 10.0pt; line-height: 115%;">Description:</span></u></b><br /> <b><u><span style="background: white; font-family: "Verdana","sans-serif"; font-size: 10.0pt; line-height: 115%;"><br /></span></u></b> <div class="MsoNormal" style="line-height: normal; margin-bottom: .0001pt; margin-bottom: 0in; mso-layout-grid-align: none; text-autospace: none;"> <div class="MsoNormal"> <span style="background: white; font-family: "Verdana","sans-serif"; font-size: 10.0pt; line-height: 115%; mso-bidi-font-weight: bold;">In this article, I will explain how to do partial page refresh using Jquery.</span><span style="font-family: "Verdana","sans-serif"; font-size: 10.0pt; line-height: 115%;"><o:p></o:p></span></div> <div class="MsoNormal"> <span style="background: white; font-family: "Verdana","sans-serif"; font-size: 10.0pt; line-height: 115%; mso-bidi-font-weight: bold;"><br /></span></div> <div class="MsoNormal"> <span style="font-family: "Verdana","sans-serif"; font-size: 10.0pt; line-height: 115%;">It’s very easy to update a particular part of the webpage using jquery. <o:p></o:p></span></div> <div class="MsoNormal"> <span style="font-family: "Verdana","sans-serif"; font-size: 10.0pt; line-height: 115%;"><br /></span></div> <div class="MsoNormal"> <span style="font-family: "Verdana","sans-serif"; font-size: 10.0pt; line-height: 115%;">In some situation, for every minute webpage needs to be updated means, refreshing the whole page for every minute will be irritated for the users. <o:p></o:p></span></div> <div class="MsoNormal"> <span style="font-family: "Verdana","sans-serif"; font-size: 10.0pt; line-height: 115%;"><br /></span></div> <div class="MsoNormal"> <span style="font-family: "Verdana","sans-serif"; font-size: 10.0pt; line-height: 115%;">For this scenario, we can use Ajax.<o:p></o:p></span></div> <div class="MsoNormal"> <span style="font-family: "Verdana","sans-serif"; font-size: 10.0pt; line-height: 115%;"><br /></span></div> <div class="MsoNormal"> <span style="font-family: "Verdana","sans-serif"; font-size: 10.0pt; line-height: 115%;">Using Ajax, the page will not refresh while updating content.<o:p></o:p></span></div> <div class="MsoNormal"> <span style="font-family: "Verdana","sans-serif"; font-size: 10.0pt; line-height: 115%;"><br /></span></div> <div class="MsoNormal"> <span style="background: white; font-family: "Verdana","sans-serif"; font-size: 10.0pt; line-height: 115%;">Ajax allows you to load data in the background and updates on the webpage without refreshing the page.</span><o:p></o:p></div> <div class="MsoNormal"> <span style="background: white; font-family: "Verdana","sans-serif"; font-size: 10.0pt; line-height: 115%;"><br /></span></div> <div class="MsoNormal" style="background: white; line-height: 14.4pt; margin-bottom: .0001pt; margin-bottom: 0in;"> <span style="background-position: initial initial; background-repeat: initial initial; font-family: Verdana, sans-serif; font-size: 10pt;">The user can continue to interact with the web page while the page requests information from the server with Ajax in the background.<o:p></o:p></span></div> <div class="MsoNormal" style="background: white; line-height: 14.4pt; margin-bottom: .0001pt; margin-bottom: 0in;"> <span style="background-position: initial initial; background-repeat: initial initial; font-family: Verdana, sans-serif; font-size: 10pt;"><br /></span></div> <div class="MsoNormal" style="background: white; line-height: 14.4pt; margin-bottom: .0001pt; margin-bottom: 0in;"> <span style="font-family: "Verdana","sans-serif"; font-size: 9.0pt; mso-bidi-font-family: "Times New Roman"; mso-fareast-font-family: "Times New Roman";"> </span><span style="font-family: Verdana, sans-serif; font-size: 10pt; line-height: 14.4pt;">Ajax used to create fast and dynamic web pages.</span></div> <div class="MsoNormal" style="background: white; line-height: 14.4pt; margin-bottom: .0001pt; margin-bottom: 0in;"> <br /></div> <div class="MsoNormal"> <b><u><span style="font-family: "Verdana","sans-serif"; font-size: 10.0pt; line-height: 115%;">Example Program:<o:p></o:p></span></u></b></div> <div class="MsoNormal"> <b><u><span style="font-family: "Verdana","sans-serif"; font-size: 10.0pt; line-height: 115%;"><br /></span></u></b></div> <div style="border: solid windowtext 1.0pt; mso-border-alt: solid windowtext .5pt; mso-element: para-border-div; padding: 1.0pt 1.0pt 1.0pt 1.0pt;"> <div style="border: none; margin-bottom: .0001pt; margin: 0in; mso-border-alt: solid windowtext .5pt; mso-padding-alt: 1.0pt 1.0pt 1.0pt 1.0pt; padding: 0in;"> <span style="color: blue; font-family: Consolas; font-size: 9.5pt;"><</span><span style="color: maroon; font-family: Consolas; font-size: 9.5pt;">html</span><span class="apple-converted-space"><span style="font-family: Consolas; font-size: 9.5pt;"> </span></span><span style="color: red; font-family: Consolas; font-size: 9.5pt;">xmlns</span><span style="color: blue; font-family: Consolas; font-size: 9.5pt;">="http://www.w3.org/1999/xhtml"></span><span style="font-size: 13.5pt;"><o:p></o:p></span></div> <div style="border: none; margin-bottom: .0001pt; margin: 0in; mso-border-alt: solid windowtext .5pt; mso-padding-alt: 1.0pt 1.0pt 1.0pt 1.0pt; padding: 0in;"> <span style="color: blue; font-family: Consolas; font-size: 9.5pt;"><</span><span style="color: maroon; font-family: Consolas; font-size: 9.5pt;">head</span><span class="apple-converted-space"><span style="font-family: Consolas; font-size: 9.5pt;"> </span></span><span style="color: red; font-family: Consolas; font-size: 9.5pt;">runat</span><span style="color: blue; font-family: Consolas; font-size: 9.5pt;">="server"></span><span style="font-size: 13.5pt;"><o:p></o:p></span></div> <div style="border: none; margin-bottom: .0001pt; margin: 0in; mso-border-alt: solid windowtext .5pt; mso-padding-alt: 1.0pt 1.0pt 1.0pt 1.0pt; padding: 0in;"> <span style="font-family: Consolas; font-size: 9.5pt;">   <span class="apple-converted-space"> </span></span><span style="color: blue; font-family: Consolas; font-size: 9.5pt;"><</span><span style="color: maroon; font-family: Consolas; font-size: 9.5pt;">title</span><span style="color: blue; font-family: Consolas; font-size: 9.5pt;">></</span><span style="color: maroon; font-family: Consolas; font-size: 9.5pt;">title</span><span style="color: blue; font-family: Consolas; font-size: 9.5pt;">></span><span style="font-size: 13.5pt;"><o:p></o:p></span></div> <div style="border: none; margin-bottom: .0001pt; margin: 0in; mso-border-alt: solid windowtext .5pt; mso-padding-alt: 1.0pt 1.0pt 1.0pt 1.0pt; padding: 0in;"> <span style="font-family: Consolas; font-size: 9.5pt;">   <span class="apple-converted-space"> </span></span><span style="color: blue; font-family: Consolas; font-size: 9.5pt;"><</span><span style="color: maroon; font-family: Consolas; font-size: 9.5pt;">script</span><span class="apple-converted-space"><span style="font-family: Consolas; font-size: 9.5pt;"> </span></span><span style="color: red; font-family: Consolas; font-size: 9.5pt;">type</span><span style="color: blue; font-family: Consolas; font-size: 9.5pt;">="text/javascript"</span><span class="apple-converted-space"><span style="font-family: Consolas; font-size: 9.5pt;"> </span></span><span style="color: red; font-family: Consolas; font-size: 9.5pt;">src</span><span style="color: blue; font-family: Consolas; font-size: 9.5pt;">="http://ajax.googleapis.com/ajax/libs/jquery/1.10.2/jquery.min.js"></span><span style="font-size: 13.5pt;"><o:p></o:p></span></div> <div style="border: none; margin-bottom: .0001pt; margin: 0in; mso-border-alt: solid windowtext .5pt; mso-padding-alt: 1.0pt 1.0pt 1.0pt 1.0pt; padding: 0in;"> <span style="font-family: Consolas; font-size: 9.5pt;">   <span class="apple-converted-space"> </span></span><span style="color: blue; font-family: Consolas; font-size: 9.5pt;"></</span><span style="color: maroon; font-family: Consolas; font-size: 9.5pt;">script</span><span style="color: blue; font-family: Consolas; font-size: 9.5pt;">></span><span style="font-size: 13.5pt;"><o:p></o:p></span></div> <div style="border: none; margin-bottom: .0001pt; margin: 0in; mso-border-alt: solid windowtext .5pt; mso-padding-alt: 1.0pt 1.0pt 1.0pt 1.0pt; padding: 0in;"> <span style="font-family: Consolas; font-size: 9.5pt;">   <span class="apple-converted-space"> </span></span><span style="color: blue; font-family: Consolas; font-size: 9.5pt;"><</span><span style="color: maroon; font-family: Consolas; font-size: 9.5pt;">script</span><span class="apple-converted-space"><span style="font-family: Consolas; font-size: 9.5pt;"> </span></span><span style="color: red; font-family: Consolas; font-size: 9.5pt;">type</span><span style="color: blue; font-family: Consolas; font-size: 9.5pt;">="text/javascript"></span><span style="font-size: 13.5pt;"><o:p></o:p></span></div> <div style="border: none; margin-bottom: .0001pt; margin: 0in; mso-border-alt: solid windowtext .5pt; mso-padding-alt: 1.0pt 1.0pt 1.0pt 1.0pt; padding: 0in;"> <span style="font-family: Consolas; font-size: 9.5pt;">       <span class="apple-converted-space"> </span>$(document).ready(</span><span style="color: blue; font-family: Consolas; font-size: 9.5pt;">function</span><span class="apple-converted-space"><span style="font-family: Consolas; font-size: 9.5pt;"> </span></span><span style="font-family: Consolas; font-size: 9.5pt;">() {</span><span style="font-size: 13.5pt;"><o:p></o:p></span></div> <div style="border: none; margin-bottom: .0001pt; margin: 0in; mso-border-alt: solid windowtext .5pt; mso-padding-alt: 1.0pt 1.0pt 1.0pt 1.0pt; padding: 0in;"> <span style="font-family: Consolas; font-size: 9.5pt;">           <span class="apple-converted-space"> </span>setInterval(</span><span style="color: blue; font-family: Consolas; font-size: 9.5pt;">function</span><span class="apple-converted-space"><span style="font-family: Consolas; font-size: 9.5pt;"> </span></span><span style="font-family: Consolas; font-size: 9.5pt;">() {</span><span style="font-size: 13.5pt;"><o:p></o:p></span></div> <div style="border: none; margin-bottom: .0001pt; margin: 0in; mso-border-alt: solid windowtext .5pt; mso-padding-alt: 1.0pt 1.0pt 1.0pt 1.0pt; padding: 0in;"> <span style="font-family: Consolas; font-size: 9.5pt;">               <span class="apple-converted-space"> </span>$.ajax({</span><span style="font-size: 13.5pt;"><o:p></o:p></span></div> <div style="border: none; margin-bottom: .0001pt; margin: 0in; mso-border-alt: solid windowtext .5pt; mso-padding-alt: 1.0pt 1.0pt 1.0pt 1.0pt; padding: 0in;"> <span style="font-family: Consolas; font-size: 9.5pt;">                   <span class="apple-converted-space"> </span>type:<span class="apple-converted-space"> </span></span><span style="color: maroon; font-family: Consolas; font-size: 9.5pt;">"POST"</span><span style="font-family: Consolas; font-size: 9.5pt;">,</span><span style="font-size: 13.5pt;"><o:p></o:p></span></div> <div style="border: none; margin-bottom: .0001pt; margin: 0in; mso-border-alt: solid windowtext .5pt; mso-padding-alt: 1.0pt 1.0pt 1.0pt 1.0pt; padding: 0in;"> <span style="font-family: Consolas; font-size: 9.5pt;">                   <span class="apple-converted-space"> </span>url:<span class="apple-converted-space"> </span></span><span style="color: maroon; font-family: Consolas; font-size: 9.5pt;">"PartialRefresh.aspx/GetRndomData"</span><span style="font-family: Consolas; font-size: 9.5pt;">,</span><span style="font-size: 13.5pt;"><o:p></o:p></span></div> <div style="border: none; margin-bottom: .0001pt; margin: 0in; mso-border-alt: solid windowtext .5pt; mso-padding-alt: 1.0pt 1.0pt 1.0pt 1.0pt; padding: 0in;"> <span style="font-family: Consolas; font-size: 9.5pt;">                   <span class="apple-converted-space"> </span>contentType:<span class="apple-converted-space"> </span></span><span style="color: maroon; font-family: Consolas; font-size: 9.5pt;">"application/json; charset=utf-8"</span><span style="font-family: Consolas; font-size: 9.5pt;">,</span><span style="font-size: 13.5pt;"><o:p></o:p></span></div> <div style="border: none; margin-bottom: .0001pt; margin: 0in; mso-border-alt: solid windowtext .5pt; mso-padding-alt: 1.0pt 1.0pt 1.0pt 1.0pt; padding: 0in;"> <span style="font-family: Consolas; font-size: 9.5pt;">                   <span class="apple-converted-space"> </span>dataType:<span class="apple-converted-space"> </span></span><span style="color: maroon; font-family: Consolas; font-size: 9.5pt;">"json"</span><span style="font-family: Consolas; font-size: 9.5pt;">,</span><span style="font-size: 13.5pt;"><o:p></o:p></span></div> <div style="border: none; margin-bottom: .0001pt; margin: 0in; mso-border-alt: solid windowtext .5pt; mso-padding-alt: 1.0pt 1.0pt 1.0pt 1.0pt; padding: 0in;"> <span style="font-family: Consolas; font-size: 9.5pt;">                   <span class="apple-converted-space"> </span>success:<span class="apple-converted-space"> </span></span><span style="color: blue; font-family: Consolas; font-size: 9.5pt;">function</span><span class="apple-converted-space"><span style="font-family: Consolas; font-size: 9.5pt;"> </span></span><span style="font-family: Consolas; font-size: 9.5pt;">successcall(response) {</span><span style="font-size: 13.5pt;"><o:p></o:p></span></div> <div style="border: none; margin-bottom: .0001pt; margin: 0in; mso-border-alt: solid windowtext .5pt; mso-padding-alt: 1.0pt 1.0pt 1.0pt 1.0pt; padding: 0in;"> <span style="font-family: Consolas; font-size: 9.5pt;">                  <span class="apple-converted-space"> </span>     $(</span><span style="color: maroon; font-family: Consolas; font-size: 9.5pt;">'#txtRandom'</span><span style="font-family: Consolas; font-size: 9.5pt;">).val(response.d);</span><span style="font-size: 13.5pt;"><o:p></o:p></span></div> <div style="border: none; margin-bottom: .0001pt; margin: 0in; mso-border-alt: solid windowtext .5pt; mso-padding-alt: 1.0pt 1.0pt 1.0pt 1.0pt; padding: 0in;"> <span style="font-family: Consolas; font-size: 9.5pt;">                   <span class="apple-converted-space"> </span>}</span><span style="font-size: 13.5pt;"><o:p></o:p></span></div> <div style="border: none; margin-bottom: .0001pt; margin: 0in; mso-border-alt: solid windowtext .5pt; mso-padding-alt: 1.0pt 1.0pt 1.0pt 1.0pt; padding: 0in;"> <span style="font-family: Consolas; font-size: 9.5pt;">               <span class="apple-converted-space"> </span>});</span><span style="font-size: 13.5pt;"><o:p></o:p></span></div> <div style="border: none; margin-bottom: .0001pt; margin: 0in; mso-border-alt: solid windowtext .5pt; mso-padding-alt: 1.0pt 1.0pt 1.0pt 1.0pt; padding: 0in;"> <span style="font-family: Consolas; font-size: 9.5pt;">           <span class="apple-converted-space"> </span>}, 3000);</span><span style="font-size: 13.5pt;"><o:p></o:p></span></div> <div style="border: none; margin-bottom: .0001pt; margin: 0in; mso-border-alt: solid windowtext .5pt; mso-padding-alt: 1.0pt 1.0pt 1.0pt 1.0pt; padding: 0in;"> <span style="font-family: Consolas; font-size: 9.5pt;">       <span class="apple-converted-space"> </span>});</span><span style="font-size: 13.5pt;"><o:p></o:p></span></div> <div style="border: none; margin-bottom: .0001pt; margin: 0in; mso-border-alt: solid windowtext .5pt; mso-padding-alt: 1.0pt 1.0pt 1.0pt 1.0pt; padding: 0in;"> <span style="font-family: Consolas; font-size: 9.5pt;">   <span class="apple-converted-space"> </span></span><span style="color: blue; font-family: Consolas; font-size: 9.5pt;"></</span><span style="color: maroon; font-family: Consolas; font-size: 9.5pt;">script</span><span style="color: blue; font-family: Consolas; font-size: 9.5pt;">></span><span style="font-size: 13.5pt;"><o:p></o:p></span></div> <div style="border: none; margin-bottom: .0001pt; margin: 0in; mso-border-alt: solid windowtext .5pt; mso-padding-alt: 1.0pt 1.0pt 1.0pt 1.0pt; padding: 0in;"> <span style="color: blue; font-family: Consolas; font-size: 9.5pt;"></</span><span style="color: maroon; font-family: Consolas; font-size: 9.5pt;">head</span><span style="color: blue; font-family: Consolas; font-size: 9.5pt;">></span><span style="font-size: 13.5pt;"><o:p></o:p></span></div> <div style="border: none; margin-bottom: .0001pt; margin: 0in; mso-border-alt: solid windowtext .5pt; mso-padding-alt: 1.0pt 1.0pt 1.0pt 1.0pt; padding: 0in;"> <span style="color: blue; font-family: Consolas; font-size: 9.5pt;"><</span><span style="color: maroon; font-family: Consolas; font-size: 9.5pt;">body</span><span style="color: blue; font-family: Consolas; font-size: 9.5pt;">></span><span style="font-size: 13.5pt;"><o:p></o:p></span></div> <div style="border: none; margin-bottom: .0001pt; margin: 0in; mso-border-alt: solid windowtext .5pt; mso-padding-alt: 1.0pt 1.0pt 1.0pt 1.0pt; padding: 0in;"> <span style="font-family: Consolas; font-size: 9.5pt;">   <span class="apple-converted-space"> </span></span><span style="color: blue; font-family: Consolas; font-size: 9.5pt;"><</span><span style="color: maroon; font-family: Consolas; font-size: 9.5pt;">form</span><span class="apple-converted-space"><span style="font-family: Consolas; font-size: 9.5pt;"> </span></span><span style="color: red; font-family: Consolas; font-size: 9.5pt;">id</span><span style="color: blue; font-family: Consolas; font-size: 9.5pt;">="form1"</span><span class="apple-converted-space"><span style="font-family: Consolas; font-size: 9.5pt;"> </span></span><span style="color: red; font-family: Consolas; font-size: 9.5pt;">runat</span><span style="color: blue; font-family: Consolas; font-size: 9.5pt;">="server"></span><span style="font-size: 13.5pt;"><o:p></o:p></span></div> <div style="border: none; margin-bottom: .0001pt; margin: 0in; mso-border-alt: solid windowtext .5pt; mso-padding-alt: 1.0pt 1.0pt 1.0pt 1.0pt; padding: 0in;"> <span style="font-family: Consolas; font-size: 9.5pt;">   <span class="apple-converted-space"> </span></span><span style="color: blue; font-family: Consolas; font-size: 9.5pt;"><</span><span style="color: maroon; font-family: Consolas; font-size: 9.5pt;">div</span><span class="apple-converted-space"><span style="font-family: Consolas; font-size: 9.5pt;"> </span></span><span style="color: red; font-family: Consolas; font-size: 9.5pt;">id</span><span style="color: blue; font-family: Consolas; font-size: 9.5pt;">="MainDiv"></span><span style="font-size: 13.5pt;"><o:p></o:p></span></div> <div style="border: none; margin-bottom: .0001pt; margin: 0in; mso-border-alt: solid windowtext .5pt; mso-padding-alt: 1.0pt 1.0pt 1.0pt 1.0pt; padding: 0in;"> <span style="font-family: Consolas; font-size: 9.5pt;">       <span class="apple-converted-space"> </span></span><span style="color: blue; font-family: Consolas; font-size: 9.5pt;"><</span><span style="color: maroon; font-family: Consolas; font-size: 9.5pt;">img</span><span class="apple-converted-space"><span style="font-family: Consolas; font-size: 9.5pt;"> </span></span><span style="color: red; font-family: Consolas; font-size: 9.5pt;">alt</span><span style="color: blue; font-family: Consolas; font-size: 9.5pt;">="Content"</span><span class="apple-converted-space"><span style="font-family: Consolas; font-size: 9.5pt;"> </span></span><span style="color: red; font-family: Consolas; font-size: 9.5pt;">src</span><span style="color: blue; font-family: Consolas; font-size: 9.5pt;">="Winter.jpg"</span><span class="apple-converted-space"><span style="font-family: Consolas; font-size: 9.5pt;"> </span></span><span style="color: red; font-family: Consolas; font-size: 9.5pt;">style</span><span style="color: blue; font-family: Consolas; font-size: 9.5pt;">="</span><span style="color: red; font-family: Consolas; font-size: 9.5pt;">height</span><span style="color: blue; font-family: Consolas; font-size: 9.5pt;">: 140px;<span class="apple-converted-space"> </span></span><span style="color: red; font-family: Consolas; font-size: 9.5pt;">width</span><span style="color: blue; font-family: Consolas; font-size: 9.5pt;">: 433px"</span><span class="apple-converted-space"><span style="font-family: Consolas; font-size: 9.5pt;"> </span></span><span style="color: blue; font-family: Consolas; font-size: 9.5pt;">/></span><span style="font-size: 13.5pt;"><o:p></o:p></span></div> <div style="border: none; margin-bottom: .0001pt; margin: 0in; mso-border-alt: solid windowtext .5pt; mso-padding-alt: 1.0pt 1.0pt 1.0pt 1.0pt; padding: 0in;"> <span style="font-family: Consolas; font-size: 9.5pt;">       <span class="apple-converted-space"> </span></span><span style="color: blue; font-family: Consolas; font-size: 9.5pt;"><</span><span style="color: maroon; font-family: Consolas; font-size: 9.5pt;">div</span><span class="apple-converted-space"><span style="font-family: Consolas; font-size: 9.5pt;"> </span></span><span style="color: red; font-family: Consolas; font-size: 9.5pt;">id</span><span style="color: blue; font-family: Consolas; font-size: 9.5pt;">="PartialLoadDiv"</span><span class="apple-converted-space"><span style="font-family: Consolas; font-size: 9.5pt;"> </span></span><span style="color: red; font-family: Consolas; font-size: 9.5pt;">style</span><span style="color: blue; font-family: Consolas; font-size: 9.5pt;">="</span><span style="color: red; font-family: Consolas; font-size: 9.5pt;">background-color</span><span style="color: blue; font-family: Consolas; font-size: 9.5pt;">:Gray"</span><span style="font-family: Consolas; font-size: 9.5pt;">;</span><span style="color: blue; font-family: Consolas; font-size: 9.5pt;">></span><span style="font-size: 13.5pt;"><o:p></o:p></span></div> <div style="border: none; margin-bottom: .0001pt; margin: 0in; mso-border-alt: solid windowtext .5pt; mso-padding-alt: 1.0pt 1.0pt 1.0pt 1.0pt; padding: 0in;"> <span style="font-family: Consolas; font-size: 9.5pt;">           <span class="apple-converted-space"> </span></span><span style="color: blue; font-family: Consolas; font-size: 9.5pt;"><</span><span style="color: maroon; font-family: Consolas; font-size: 9.5pt;">table</span><span class="apple-converted-space"><span style="font-family: Consolas; font-size: 9.5pt;"> </span></span><span style="color: red; font-family: Consolas; font-size: 9.5pt;">style</span><span style="color: blue; font-family: Consolas; font-size: 9.5pt;">="</span><span style="color: red; font-family: Consolas; font-size: 9.5pt;">height</span><span style="color: blue; font-family: Consolas; font-size: 9.5pt;">: 117px;<span class="apple-converted-space"> </span></span><span style="color: red; font-family: Consolas; font-size: 9.5pt;">width</span><span style="color: blue; font-family: Consolas; font-size: 9.5pt;">: 241px"></span><span style="font-size: 13.5pt;"><o:p></o:p></span></div> <div style="border: none; margin-bottom: .0001pt; margin: 0in; mso-border-alt: solid windowtext .5pt; mso-padding-alt: 1.0pt 1.0pt 1.0pt 1.0pt; padding: 0in;"> <span style="font-family: Consolas; font-size: 9.5pt;">               <span class="apple-converted-space"> </span></span><span style="color: blue; font-family: Consolas; font-size: 9.5pt;"><</span><span style="color: maroon; font-family: Consolas; font-size: 9.5pt;">tr</span><span style="color: blue; font-family: Consolas; font-size: 9.5pt;">></span><span style="font-size: 13.5pt;"><o:p></o:p></span></div> <div style="border: none; margin-bottom: .0001pt; margin: 0in; mso-border-alt: solid windowtext .5pt; mso-padding-alt: 1.0pt 1.0pt 1.0pt 1.0pt; padding: 0in;"> <span style="font-family: Consolas; font-size: 9.5pt;">                   <span class="apple-converted-space"> </span></span><span style="color: blue; font-family: Consolas; font-size: 9.5pt;"><</span><span style="color: maroon; font-family: Consolas; font-size: 9.5pt;">h3</span><span style="color: blue; font-family: Consolas; font-size: 9.5pt;">></span><span style="font-size: 13.5pt;"><o:p></o:p></span></div> <div style="border: none; margin-bottom: .0001pt; margin: 0in; mso-border-alt: solid windowtext .5pt; mso-padding-alt: 1.0pt 1.0pt 1.0pt 1.0pt; padding: 0in;"> <span style="font-family: Consolas; font-size: 9.5pt;">                       <span class="apple-converted-space"> </span>This div will partialy update</span><span style="color: blue; font-family: Consolas; font-size: 9.5pt;"></</span><span style="color: maroon; font-family: Consolas; font-size: 9.5pt;">h3</span><span style="color: blue; font-family: Consolas; font-size: 9.5pt;">></span><span style="font-size: 13.5pt;"><o:p></o:p></span></div> <div style="border: none; margin-bottom: .0001pt; margin: 0in; mso-border-alt: solid windowtext .5pt; mso-padding-alt: 1.0pt 1.0pt 1.0pt 1.0pt; padding: 0in;"> <span style="font-family: Consolas; font-size: 9.5pt;">               <span class="apple-converted-space"> </span></span><span style="color: blue; font-family: Consolas; font-size: 9.5pt;"></</span><span style="color: maroon; font-family: Consolas; font-size: 9.5pt;">tr</span><span style="color: blue; font-family: Consolas; font-size: 9.5pt;">></span><span style="font-size: 13.5pt;"><o:p></o:p></span></div> <div style="border: none; margin-bottom: .0001pt; margin: 0in; mso-border-alt: solid windowtext .5pt; mso-padding-alt: 1.0pt 1.0pt 1.0pt 1.0pt; padding: 0in;"> <span style="font-family: Consolas; font-size: 9.5pt;">               <span class="apple-converted-space"> </span></span><span style="color: blue; font-family: Consolas; font-size: 9.5pt;"><</span><span style="color: maroon; font-family: Consolas; font-size: 9.5pt;">tr</span><span style="color: blue; font-family: Consolas; font-size: 9.5pt;">></span><span style="font-size: 13.5pt;"><o:p></o:p></span></div> <div style="border: none; margin-bottom: .0001pt; margin: 0in; mso-border-alt: solid windowtext .5pt; mso-padding-alt: 1.0pt 1.0pt 1.0pt 1.0pt; padding: 0in;"> <span style="font-family: Consolas; font-size: 9.5pt;">                   <span class="apple-converted-space"> </span></span><span style="color: blue; font-family: Consolas; font-size: 9.5pt;"><</span><span style="color: maroon; font-family: Consolas; font-size: 9.5pt;">td</span><span style="color: blue; font-family: Consolas; font-size: 9.5pt;">></span><span style="font-size: 13.5pt;"><o:p></o:p></span></div> <div style="border: none; margin-bottom: .0001pt; margin: 0in; mso-border-alt: solid windowtext .5pt; mso-padding-alt: 1.0pt 1.0pt 1.0pt 1.0pt; padding: 0in;"> <span style="font-family: Consolas; font-size: 9.5pt;">                       <span class="apple-converted-space"> </span></span><span style="color: blue; font-family: Consolas; font-size: 9.5pt;"><</span><span style="color: maroon; font-family: Consolas; font-size: 9.5pt;">asp</span><span style="color: blue; font-family: Consolas; font-size: 9.5pt;">:</span><span style="color: maroon; font-family: Consolas; font-size: 9.5pt;">Label</span><span class="apple-converted-space"><span style="font-family: Consolas; font-size: 9.5pt;"> </span></span><span style="color: red; font-family: Consolas; font-size: 9.5pt;">ID</span><span style="color: blue; font-family: Consolas; font-size: 9.5pt;">="lblRandom"</span><span class="apple-converted-space"><span style="font-family: Consolas; font-size: 9.5pt;"> </span></span><span style="color: red; font-family: Consolas; font-size: 9.5pt;">runat</span><span style="color: blue; font-family: Consolas; font-size: 9.5pt;">="server"</span><span class="apple-converted-space"><span style="font-family: Consolas; font-size: 9.5pt;"> </span></span><span style="color: red; font-family: Consolas; font-size: 9.5pt;">Text</span><span style="color: blue; font-family: Consolas; font-size: 9.5pt;">="Random Data is:"></</span><span style="color: maroon; font-family: Consolas; font-size: 9.5pt;">asp</span><span style="color: blue; font-family: Consolas; font-size: 9.5pt;">:</span><span style="color: maroon; font-family: Consolas; font-size: 9.5pt;">Label</span><span style="color: blue; font-family: Consolas; font-size: 9.5pt;">></span><span style="font-size: 13.5pt;"><o:p></o:p></span></div> <div style="border: none; margin-bottom: .0001pt; margin: 0in; mso-border-alt: solid windowtext .5pt; mso-padding-alt: 1.0pt 1.0pt 1.0pt 1.0pt; padding: 0in;"> <span style="font-family: Consolas; font-size: 9.5pt;">                   <span class="apple-converted-space"> </span></span><span style="color: blue; font-family: Consolas; font-size: 9.5pt;"></</span><span style="color: maroon; font-family: Consolas; font-size: 9.5pt;">td</span><span style="color: blue; font-family: Consolas; font-size: 9.5pt;">></span><span style="font-size: 13.5pt;"><o:p></o:p></span></div> <div style="border: none; margin-bottom: .0001pt; margin: 0in; mso-border-alt: solid windowtext .5pt; mso-padding-alt: 1.0pt 1.0pt 1.0pt 1.0pt; padding: 0in;"> <span style="font-family: Consolas; font-size: 9.5pt;">                   <span class="apple-converted-space"> </span></span><span style="color: blue; font-family: Consolas; font-size: 9.5pt;"><</span><span style="color: maroon; font-family: Consolas; font-size: 9.5pt;">td</span><span style="color: blue; font-family: Consolas; font-size: 9.5pt;">></span><span style="font-size: 13.5pt;"><o:p></o:p></span></div> <div style="border: none; margin-bottom: .0001pt; margin: 0in; mso-border-alt: solid windowtext .5pt; mso-padding-alt: 1.0pt 1.0pt 1.0pt 1.0pt; padding: 0in;"> <span style="font-family: Consolas; font-size: 9.5pt;">                       <span class="apple-converted-space"> </span></span><span style="color: blue; font-family: Consolas; font-size: 9.5pt;"><</span><span style="color: maroon; font-family: Consolas; font-size: 9.5pt;">asp</span><span style="color: blue; font-family: Consolas; font-size: 9.5pt;">:</span><span style="color: maroon; font-family: Consolas; font-size: 9.5pt;">TextBox</span><span class="apple-converted-space"><span style="font-family: Consolas; font-size: 9.5pt;"> </span></span><span style="color: red; font-family: Consolas; font-size: 9.5pt;">ID</span><span style="color: blue; font-family: Consolas; font-size: 9.5pt;">="txtRandom"</span><span class="apple-converted-space"><span style="font-family: Consolas; font-size: 9.5pt;"> </span></span><span style="color: red; font-family: Consolas; font-size: 9.5pt;">runat</span><span style="color: blue; font-family: Consolas; font-size: 9.5pt;">="server"></</span><span style="color: maroon; font-family: Consolas; font-size: 9.5pt;">asp</span><span style="color: blue; font-family: Consolas; font-size: 9.5pt;">:</span><span style="color: maroon; font-family: Consolas; font-size: 9.5pt;">TextBox</span><span style="color: blue; font-family: Consolas; font-size: 9.5pt;">></span><span style="font-size: 13.5pt;"><o:p></o:p></span></div> <div style="border: none; margin-bottom: .0001pt; margin: 0in; mso-border-alt: solid windowtext .5pt; mso-padding-alt: 1.0pt 1.0pt 1.0pt 1.0pt; padding: 0in;"> <span style="font-family: Consolas; font-size: 9.5pt;">                   <span class="apple-converted-space"> </span></span><span style="color: blue; font-family: Consolas; font-size: 9.5pt;"></</span><span style="color: maroon; font-family: Consolas; font-size: 9.5pt;">td</span><span style="color: blue; font-family: Consolas; font-size: 9.5pt;">></span><span style="font-size: 13.5pt;"><o:p></o:p></span></div> <div style="border: none; margin-bottom: .0001pt; margin: 0in; mso-border-alt: solid windowtext .5pt; mso-padding-alt: 1.0pt 1.0pt 1.0pt 1.0pt; padding: 0in;"> <span style="font-family: Consolas; font-size: 9.5pt;">               <span class="apple-converted-space"> </span></span><span style="color: blue; font-family: Consolas; font-size: 9.5pt;"></</span><span style="color: maroon; font-family: Consolas; font-size: 9.5pt;">tr</span><span style="color: blue; font-family: Consolas; font-size: 9.5pt;">></span><span style="font-size: 13.5pt;"><o:p></o:p></span></div> <div style="border: none; margin-bottom: .0001pt; margin: 0in; mso-border-alt: solid windowtext .5pt; mso-padding-alt: 1.0pt 1.0pt 1.0pt 1.0pt; padding: 0in;"> <span style="font-family: Consolas; font-size: 9.5pt;">           <span class="apple-converted-space"> </span></span><span style="color: blue; font-family: Consolas; font-size: 9.5pt;"></</span><span style="color: maroon; font-family: Consolas; font-size: 9.5pt;">table</span><span style="color: blue; font-family: Consolas; font-size: 9.5pt;">></span><span style="font-size: 13.5pt;"><o:p></o:p></span></div> <div style="border: none; margin-bottom: .0001pt; margin: 0in; mso-border-alt: solid windowtext .5pt; mso-padding-alt: 1.0pt 1.0pt 1.0pt 1.0pt; padding: 0in;"> <span style="font-family: Consolas; font-size: 9.5pt;">       <span class="apple-converted-space"> </span></span><span style="color: blue; font-family: Consolas; font-size: 9.5pt;"></</span><span style="color: maroon; font-family: Consolas; font-size: 9.5pt;">div</span><span style="color: blue; font-family: Consolas; font-size: 9.5pt;">></span><span style="font-size: 13.5pt;"><o:p></o:p></span></div> <div style="border: none; margin-bottom: .0001pt; margin: 0in; mso-border-alt: solid windowtext .5pt; mso-padding-alt: 1.0pt 1.0pt 1.0pt 1.0pt; padding: 0in;"> <span style="font-family: Consolas; font-size: 9.5pt;">   <span class="apple-converted-space"> </span></span><span style="color: blue; font-family: Consolas; font-size: 9.5pt;"></</span><span style="color: maroon; font-family: Consolas; font-size: 9.5pt;">div</span><span style="color: blue; font-family: Consolas; font-size: 9.5pt;">></span><span style="font-size: 13.5pt;"><o:p></o:p></span></div> <div style="border: none; margin-bottom: .0001pt; margin: 0in; mso-border-alt: solid windowtext .5pt; mso-padding-alt: 1.0pt 1.0pt 1.0pt 1.0pt; padding: 0in;"> <span style="font-family: Consolas; font-size: 9.5pt;">   <span class="apple-converted-space"> </span></span><span style="color: blue; font-family: Consolas; font-size: 9.5pt;"></</span><span style="color: maroon; font-family: Consolas; font-size: 9.5pt;">form</span><span style="color: blue; font-family: Consolas; font-size: 9.5pt;">></span><span style="font-size: 13.5pt;"><o:p></o:p></span></div> <div style="border: none; margin-bottom: .0001pt; margin: 0in; mso-border-alt: solid windowtext .5pt; mso-padding-alt: 1.0pt 1.0pt 1.0pt 1.0pt; padding: 0in;"> <span style="color: blue; font-family: Consolas; font-size: 9.5pt;"></</span><span style="color: maroon; font-family: Consolas; font-size: 9.5pt;">body</span><span style="color: blue; font-family: Consolas; font-size: 9.5pt;">></span><span style="font-size: 13.5pt;"><o:p></o:p></span></div> <div style="border: none; margin-bottom: .0001pt; margin: 0in; mso-border-alt: solid windowtext .5pt; mso-padding-alt: 1.0pt 1.0pt 1.0pt 1.0pt; padding: 0in;"> <span style="color: blue; font-family: Consolas; font-size: 9.5pt;"></</span><span style="color: maroon; font-family: Consolas; font-size: 9.5pt;">html</span><span style="color: blue; font-family: Consolas; font-size: 9.5pt;">></span><span style="font-size: 13.5pt;"><o:p></o:p></span></div> <div style="border: none; margin-bottom: .0001pt; margin: 0in; mso-border-alt: solid windowtext .5pt; mso-padding-alt: 1.0pt 1.0pt 1.0pt 1.0pt; padding: 0in;"> <br /></div> <div style="border: none; margin-bottom: .0001pt; margin: 0in; mso-border-alt: solid windowtext .5pt; mso-padding-alt: 1.0pt 1.0pt 1.0pt 1.0pt; padding: 0in;"> <b><u><span style="background: white; color: #666666; font-family: ""sans-serif"","serif"; font-size: 11.0pt;">Code Behind:</span></u></b><span style="font-size: 13.5pt;"><o:p></o:p></span></div> <div style="border: none; margin-bottom: .0001pt; margin: 0in; mso-border-alt: solid windowtext .5pt; mso-padding-alt: 1.0pt 1.0pt 1.0pt 1.0pt; padding: 0in;"> <br /></div> <div style="border: none; margin-bottom: .0001pt; margin: 0in; mso-border-alt: solid windowtext .5pt; mso-padding-alt: 1.0pt 1.0pt 1.0pt 1.0pt; padding: 0in;"> <span style="font-family: Consolas; font-size: 9.5pt;">[System.Web.Services.</span><span style="color: #2b91af; font-family: Consolas; font-size: 9.5pt;">WebMethod</span><span style="font-family: Consolas; font-size: 9.5pt;">]</span><span style="font-size: 13.5pt;"><o:p></o:p></span></div> <div style="border: none; margin-bottom: .0001pt; margin: 0in; mso-border-alt: solid windowtext .5pt; mso-padding-alt: 1.0pt 1.0pt 1.0pt 1.0pt; padding: 0in;"> <span style="color: blue; font-family: Consolas; font-size: 9.5pt;">public</span><span class="apple-converted-space"><span style="font-family: Consolas; font-size: 9.5pt;"> </span></span><span style="color: blue; font-family: Consolas; font-size: 9.5pt;">static</span><span class="apple-converted-space"><span style="font-family: Consolas; font-size: 9.5pt;"> </span></span><span style="color: blue; font-family: Consolas; font-size: 9.5pt;">string</span><span class="apple-converted-space"><span style="font-family: Consolas; font-size: 9.5pt;"> </span></span><span style="font-family: Consolas; font-size: 9.5pt;">GetRndomData()</span><span style="font-size: 13.5pt;"><o:p></o:p></span></div> <div style="border: none; margin-bottom: .0001pt; margin: 0in; mso-border-alt: solid windowtext .5pt; mso-padding-alt: 1.0pt 1.0pt 1.0pt 1.0pt; padding: 0in;"> <span style="font-family: Consolas; font-size: 9.5pt;">{</span><span style="font-size: 13.5pt;"><o:p></o:p></span></div> <div style="border: none; margin-bottom: .0001pt; margin: 0in; mso-border-alt: solid windowtext .5pt; mso-padding-alt: 1.0pt 1.0pt 1.0pt 1.0pt; padding: 0in; text-indent: .5in;"> <span style="color: #2b91af; font-family: Consolas; font-size: 9.5pt;">Random</span><span class="apple-converted-space"><span style="font-family: Consolas; font-size: 9.5pt;"> </span></span><span style="font-family: Consolas; font-size: 9.5pt;">obj =<span class="apple-converted-space"> </span></span><span style="color: blue; font-family: Consolas; font-size: 9.5pt;">new</span><span class="apple-converted-space"><span style="font-family: Consolas; font-size: 9.5pt;"> </span></span><span style="color: #2b91af; font-family: Consolas; font-size: 9.5pt;">Random</span><span style="font-family: Consolas; font-size: 9.5pt;">();</span><span style="font-size: 13.5pt;"><o:p></o:p></span></div> <div style="border: none; margin-bottom: .0001pt; margin: 0in; mso-border-alt: solid windowtext .5pt; mso-padding-alt: 1.0pt 1.0pt 1.0pt 1.0pt; padding: 0in;"> <span style="font-family: Consolas; font-size: 9.5pt;">     <span class="apple-converted-space"> </span></span><span style="color: blue; font-family: Consolas; font-size: 9.5pt;">int</span><span class="apple-converted-space"><span style="font-family: Consolas; font-size: 9.5pt;"> </span></span><span style="font-family: Consolas; font-size: 9.5pt;">rndValues = obj.Next(0, 25);</span><span style="font-size: 13.5pt;"><o:p></o:p></span></div> <div style="border: none; margin-bottom: .0001pt; margin: 0in; mso-border-alt: solid windowtext .5pt; mso-padding-alt: 1.0pt 1.0pt 1.0pt 1.0pt; padding: 0in;"> <span style="font-family: Consolas; font-size: 9.5pt;">      <span class="apple-converted-space"> </span></span><span style="color: blue; font-family: Consolas; font-size: 9.5pt;">return</span><span class="apple-converted-space"><span style="font-family: Consolas; font-size: 9.5pt;"> </span></span><span style="font-family: Consolas; font-size: 9.5pt;">rndValues.ToString();</span><span style="font-size: 13.5pt;"><o:p></o:p></span></div> <div style="border: none; margin-bottom: .0001pt; margin: 0in; mso-border-alt: solid windowtext .5pt; mso-padding-alt: 1.0pt 1.0pt 1.0pt 1.0pt; padding: 0in;"> <span style="font-family: Consolas; font-size: 9.5pt;">}</span><span style="font-size: 13.5pt;"><o:p></o:p></span></div> </div> <div class="MsoNormal"> <br /></div> <br /> <div class="MsoNormal"> <span style="font-family: "Verdana","sans-serif"; font-size: 10.0pt; line-height: 115%;">In the above example, the page will updates particular part for every three seconds. The page will not refresh while updating content.<o:p></o:p></span></div> </div> </div>

How to do partial page updates using Jquery and Ajax?

Description: In this article, I will explain how to do partial page refresh using Jquery. It’s very easy to update a particular par...

Read more »

How to add multiple version of jquery on the same page?

<div dir="ltr" style="text-align: left;" trbidi="on"> <div style="margin-bottom: .0001pt; margin: 0in;"> <b><u><span style="color: #666666; font-family: "Verdana","sans-serif"; font-size: 10.0pt;">Introduction:</span></u></b><b><u><span style="font-family: Verdana, sans-serif; font-size: 10pt;"><o:p></o:p></span></u></b></div> <div style="background: white; line-height: 14.4pt; margin-bottom: .0001pt; margin: 0in;"> <br /></div> <div style="background: white; line-height: 13.5pt; margin-bottom: .0001pt; margin: 0in;"> <span style="font-family: "Verdana","sans-serif"; font-size: 10.0pt; mso-bidi-font-weight: bold;">In this article, I will explain how to add multiple version of jquery on the same page.</span><span style="font-family: "Verdana","sans-serif"; font-size: 10.0pt;"><o:p></o:p></span></div> <div style="background: white; line-height: 13.5pt; margin-bottom: .0001pt; margin: 0in;"> <br /></div> <div style="background: white; line-height: 13.5pt; margin-bottom: .0001pt; margin: 0in;"> <span style="font-family: "Verdana","sans-serif"; font-size: 10.0pt; mso-bidi-font-weight: bold;">If you are working on a website that already used an older version of jquery and now you want to use newer version. This time upgrading is not an option here. For this scenario use $.conflict() method.<o:p></o:p></span></div> <div style="background: white; line-height: 13.5pt; margin-bottom: .0001pt; margin: 0in;"> <br /></div> <div class="MsoNormal" style="background: white; line-height: 14.4pt; margin-bottom: .0001pt; margin-bottom: 0in;"> <span style="background-position: initial initial; background-repeat: initial initial; font-family: Verdana, sans-serif; font-size: 10pt;">In jQuery, the ‘$’ sign is just an alias to jquery ()<o:p></o:p></span></div> <div class="MsoNormal" style="background: white; line-height: 14.4pt; margin-bottom: .0001pt; margin-bottom: 0in;"> <br /></div> <div class="MsoNormal" style="margin-bottom: 0.0001pt;"> <span style="font-family: "Verdana","sans-serif"; font-size: 10.0pt; mso-bidi-font-weight: bold;">$.fn.jquery – it will return the jquery file version.</span><span style="color: blue; font-family: Consolas; font-size: 9.5pt;"><o:p></o:p></span></div> <div style="background: white; line-height: 13.5pt; margin-bottom: .0001pt; margin: 0in;"> <br /></div> <div style="background: white; line-height: 13.5pt; margin-bottom: .0001pt; margin: 0in;"> <span style="font-family: "Verdana","sans-serif"; font-size: 10.0pt; mso-bidi-font-weight: bold;">Here, I am using two version of jquery(version 1.3.0 and version 1.10.2).<o:p></o:p></span></div> <div class="MsoNormal" style="margin-bottom: 0.0001pt;"> <span style="font-family: Consolas; font-size: 9.5pt;">  <o:p></o:p></span></div> <div class="MsoNormal" style="margin-bottom: 0.0001pt;"> <span style="color: blue; font-family: Consolas; font-size: 9.5pt;"><</span><span style="color: maroon; font-family: Consolas; font-size: 9.5pt;">script</span><span style="font-family: Consolas; font-size: 9.5pt;"> <span style="color: red;">type</span><span style="color: blue;">="text/javascript"</span> <span style="color: red;">src</span><span style="color: blue;">="http://ajax.googleapis.com/ajax/libs/jquery/1.3.0/jquery.min.js"></</span><span style="color: maroon;">script</span><span style="color: blue;">></span><o:p></o:p></span></div> <div class="MsoNormal" style="margin-bottom: 0.0001pt;"> <span style="color: blue; font-family: Consolas; font-size: 9.5pt;"><</span><span style="color: maroon; font-family: Consolas; font-size: 9.5pt;">script</span><span style="font-family: Consolas; font-size: 9.5pt;"> <span style="color: red;">type</span><span style="color: blue;">="text/javascript"</span> <span style="color: red;">src</span><span style="color: blue;">="http://ajax.googleapis.com/ajax/libs/jquery/1.10.2/jquery.min.js"></</span><span style="color: maroon;">script</span><span style="color: blue;">></span></span><span style="color: blue; font-family: Consolas; font-size: 9.5pt;"> </span></div> <div class="MsoNormal" style="margin-bottom: 0.0001pt;"> <br /></div> <div class="MsoNormal" style="margin-bottom: 0.0001pt;"> <span style="font-family: "Verdana","sans-serif"; font-size: 10.0pt; mso-bidi-font-weight: bold;">Before we using conflict() method,<o:p></o:p></span></div> <div class="MsoNormal" style="margin-bottom: 0.0001pt;"> <br /></div> <div class="MsoNormal" style="margin-bottom: 0.0001pt;"> <span style="font-family: "Verdana","sans-serif"; font-size: 10.0pt; mso-bidi-font-weight: bold;">$ - it will have the version of last included jquery file. (Version 1.10.2)<o:p></o:p></span></div> <div class="MsoNormal" style="background: white; line-height: 14.4pt; margin-bottom: .0001pt; margin-bottom: 0in;"> <br /></div> <div style="border: solid windowtext 1.0pt; mso-border-alt: solid windowtext .5pt; mso-element: para-border-div; padding: 1.0pt 4.0pt 1.0pt 4.0pt;"> <div class="MsoNormal" style="border: none; margin-bottom: 0.0001pt; padding: 0in;"> <span style="font-family: Consolas; font-size: 9.5pt;">$(<span style="color: maroon;">'#btnBrowserVersion'</span>).click(<span style="color: blue;">function</span> () {<o:p></o:p></span></div> <div class="MsoNormal" style="border: none; margin-bottom: 0.0001pt; padding: 0in;"> <span style="font-family: Consolas; font-size: 9.5pt;">    alert($.fn.jquery);<o:p></o:p></span></div> <div class="MsoNormal" style="border: none; margin-bottom: 0.0001pt; padding: 0in;"> <span style="font-family: Consolas; font-size: 9.5pt;">});<o:p></o:p></span></div> </div> <div style="background: white; line-height: 13.5pt; margin-bottom: .0001pt; margin: 0in;"> <br /></div> <div style="background: white; line-height: 13.5pt; margin-bottom: .0001pt; margin: 0in;"> <span style="font-family: "Verdana","sans-serif"; font-size: 10.0pt;">The above code will return version 1.10.2. Because last included ‘js’ file will be assign for the alias name ‘$’<o:p></o:p></span></div> <div style="background: white; line-height: 13.5pt; margin-bottom: .0001pt; margin: 0in;"> <br /></div> <div style="background: white; line-height: 13.5pt; margin-bottom: .0001pt; margin: 0in;"> <span style="font-family: "Verdana","sans-serif"; font-size: 10.0pt;">After we using conflict() method, $ sign will be replaced with first included js file.<o:p></o:p></span></div> <div style="background: white; line-height: 13.5pt; margin-bottom: .0001pt; margin: 0in;"> <br /></div> <div style="border: solid windowtext 1.0pt; mso-border-alt: solid windowtext .5pt; mso-element: para-border-div; padding: 1.0pt 4.0pt 1.0pt 4.0pt;"> <div class="MsoNormal" style="border: none; margin-bottom: 0.0001pt; padding: 0in;"> <span style="font-family: Consolas; font-size: 9.5pt;">$(<span style="color: maroon;">'#btnAfterConflict'</span>).click(<span style="color: blue;">function</span> () {<o:p></o:p></span></div> <div class="MsoNormal" style="border: none; margin-bottom: 0.0001pt; padding: 0in;"> <span style="font-family: Consolas; font-size: 9.5pt;">    jq = $.noConflict();<o:p></o:p></span></div> <div class="MsoNormal" style="border: none; margin-bottom: 0.0001pt; padding: 0in;"> <span style="font-family: Consolas; font-size: 9.5pt;">    alert($.fn.jquery);<o:p></o:p></span></div> <div class="MsoNormal" style="border: none; margin-bottom: 0.0001pt; padding: 0in;"> <span style="font-family: Consolas; font-size: 9.5pt;">});<o:p></o:p></span></div> </div> <div class="MsoNormal" style="margin-bottom: 0.0001pt;"> <br /></div> <div style="background: white; line-height: 13.5pt; margin-bottom: .0001pt; margin: 0in;"> <span style="font-family: "Verdana","sans-serif"; font-size: 10.0pt;">The above code will return version 1.3.0.  Because, After using conflict() method, first included js file will replace with the alias name ‘$’.<o:p></o:p></span></div> <div style="background: white; line-height: 13.5pt; margin-bottom: .0001pt; margin: 0in;"> <br /></div> <div style="background: white; line-height: 13.5pt; margin-bottom: .0001pt; margin: 0in;"> <span style="font-family: "Verdana","sans-serif"; font-size: 10.0pt;">After conflict, if we want to use other version use the alias name ‘jq’ from the above coding.<o:p></o:p></span></div> <div style="background: white; line-height: 13.5pt; margin-bottom: .0001pt; margin: 0in;"> <span style="font-family: "Verdana","sans-serif"; font-size: 10.0pt;"> </span><span style="font-family: Verdana, sans-serif; font-size: 10pt; line-height: 13.5pt;"> </span><span style="font-family: Verdana, sans-serif; font-size: 10pt; line-height: 13.5pt;"> </span></div> <div style="background: white; line-height: 13.5pt; margin-bottom: .0001pt; margin: 0in;"> <b><u><span style="font-family: "Verdana","sans-serif"; font-size: 10.0pt;">Example Program:<o:p></o:p></span></u></b></div> <div style="background: white; line-height: 13.5pt; margin-bottom: .0001pt; margin: 0in;"> <br /></div> <div style="border: solid windowtext 1.0pt; mso-border-alt: solid windowtext .5pt; mso-element: para-border-div; padding: 1.0pt 4.0pt 1.0pt 4.0pt;"> <div class="MsoNormal" style="border: none; margin-bottom: 0.0001pt; padding: 0in;"> <span style="color: blue; font-family: Consolas; font-size: 9.5pt;"><</span><span style="color: maroon; font-family: Consolas; font-size: 9.5pt;">html</span><span style="color: blue; font-family: Consolas; font-size: 9.5pt;">></span><span style="font-family: Consolas; font-size: 9.5pt;"><o:p></o:p></span></div> <div class="MsoNormal" style="border: none; margin-bottom: 0.0001pt; padding: 0in;"> <span style="color: blue; font-family: Consolas; font-size: 9.5pt;"><</span><span style="color: maroon; font-family: Consolas; font-size: 9.5pt;">head</span><span style="color: blue; font-family: Consolas; font-size: 9.5pt;">></span><span style="font-family: Consolas; font-size: 9.5pt;"><o:p></o:p></span></div> <div class="MsoNormal" style="border: none; margin-bottom: 0.0001pt; padding: 0in;"> <span style="font-family: Consolas; font-size: 9.5pt;">    <span style="color: blue;"><</span><span style="color: maroon;">title</span><span style="color: blue;">></span>Multiple Version of Jquery on Same Page<span style="color: blue;"></</span><span style="color: maroon;">title</span><span style="color: blue;">></span><o:p></o:p></span></div> <div class="MsoNormal" style="border: none; margin-bottom: 0.0001pt; padding: 0in;"> <span style="font-family: Consolas; font-size: 9.5pt;">    <span style="color: blue;"><</span><span style="color: maroon;">script</span> <span style="color: red;">type</span><span style="color: blue;">="text/javascript"</span> <span style="color: red;">src</span><span style="color: blue;">="http://ajax.googleapis.com/ajax/libs/jquery/1.3.0/jquery.min.js"></</span><span style="color: maroon;">script</span><span style="color: blue;">></span><o:p></o:p></span></div> <div class="MsoNormal" style="border: none; margin-bottom: 0.0001pt; padding: 0in;"> <span style="font-family: Consolas; font-size: 9.5pt;">    <span style="color: blue;"><</span><span style="color: maroon;">script</span> <span style="color: red;">type</span><span style="color: blue;">="text/javascript"</span> <span style="color: red;">src</span><span style="color: blue;">="http://ajax.googleapis.com/ajax/libs/jquery/1.10.2/jquery.min.js"></</span><span style="color: maroon;">script</span><span style="color: blue;">></span><o:p></o:p></span></div> <div class="MsoNormal" style="border: none; margin-bottom: 0.0001pt; padding: 0in;"> <span style="font-family: Consolas; font-size: 9.5pt;">    <span style="color: blue;"><</span><span style="color: maroon;">script</span> <span style="color: red;">type</span><span style="color: blue;">="text/javascript"></span><o:p></o:p></span></div> <div class="MsoNormal" style="border: none; margin-bottom: 0.0001pt; padding: 0in;"> <span style="font-family: Consolas; font-size: 9.5pt;">        $(document).ready(<span style="color: blue;">function</span> () {<o:p></o:p></span></div> <div class="MsoNormal" style="border: none; margin-bottom: 0.0001pt; padding: 0in;"> <span style="font-family: Consolas; font-size: 9.5pt;">            $(<span style="color: maroon;">'#btnBeforeConflict'</span>).click(<span style="color: blue;">function</span> () {<o:p></o:p></span></div> <div class="MsoNormal" style="border: none; margin-bottom: 0.0001pt; padding: 0in;"> <span style="font-family: Consolas; font-size: 9.5pt;">                alert($.browser.version);<o:p></o:p></span></div> <div class="MsoNormal" style="border: none; margin-bottom: 0.0001pt; padding: 0in;"> <span style="font-family: Consolas; font-size: 9.5pt;">                <span style="color: blue;">return</span> <span style="color: blue;">false</span>;<o:p></o:p></span></div> <div class="MsoNormal" style="border: none; margin-bottom: 0.0001pt; padding: 0in;"> <span style="font-family: Consolas; font-size: 9.5pt;">            });<o:p></o:p></span></div> <div class="MsoNormal" style="border: none; margin-bottom: 0.0001pt; padding: 0in;"> <span style="font-family: Consolas; font-size: 9.5pt;">            $(<span style="color: maroon;">'#btnAfterConflict'</span>).click(<span style="color: blue;">function</span> () {<o:p></o:p></span></div> <div class="MsoNormal" style="border: none; margin-bottom: 0.0001pt; padding: 0in;"> <span style="font-family: Consolas; font-size: 9.5pt;">                jq = $.noConflict();<o:p></o:p></span></div> <div class="MsoNormal" style="border: none; margin-bottom: 0.0001pt; padding: 0in;"> <span style="font-family: Consolas; font-size: 9.5pt;">                alert($.browser.version);<o:p></o:p></span></div> <div class="MsoNormal" style="border: none; margin-bottom: 0.0001pt; padding: 0in;"> <span style="font-family: Consolas; font-size: 9.5pt;">                <span style="color: blue;">return</span> <span style="color: blue;">false</span>;<o:p></o:p></span></div> <div class="MsoNormal" style="border: none; margin-bottom: 0.0001pt; padding: 0in;"> <span style="font-family: Consolas; font-size: 9.5pt;">            });<o:p></o:p></span></div> <div class="MsoNormal" style="border: none; margin-bottom: 0.0001pt; padding: 0in;"> <span style="font-family: Consolas; font-size: 9.5pt;">        });<o:p></o:p></span></div> <div class="MsoNormal" style="border: none; margin-bottom: 0.0001pt; padding: 0in;"> <span style="font-family: Consolas; font-size: 9.5pt;">    <span style="color: blue;"></</span><span style="color: maroon;">script</span><span style="color: blue;">></span><o:p></o:p></span></div> <div class="MsoNormal" style="border: none; margin-bottom: 0.0001pt; padding: 0in;"> <span style="color: blue; font-family: Consolas; font-size: 9.5pt;"></</span><span style="color: maroon; font-family: Consolas; font-size: 9.5pt;">head</span><span style="color: blue; font-family: Consolas; font-size: 9.5pt;">></span><span style="font-family: Consolas; font-size: 9.5pt;"><o:p></o:p></span></div> <div class="MsoNormal" style="border: none; margin-bottom: 0.0001pt; padding: 0in;"> <span style="color: blue; font-family: Consolas; font-size: 9.5pt;"><</span><span style="color: maroon; font-family: Consolas; font-size: 9.5pt;">body</span><span style="color: blue; font-family: Consolas; font-size: 9.5pt;">></span><span style="font-family: Consolas; font-size: 9.5pt;"><o:p></o:p></span></div> <div class="MsoNormal" style="border: none; margin-bottom: 0.0001pt; padding: 0in;"> <span style="font-family: Consolas; font-size: 9.5pt;">    <span style="color: blue;"><</span><span style="color: maroon;">form</span> <span style="color: red;">id</span><span style="color: blue;">="form1"</span> <span style="color: red;">runat</span><span style="color: blue;">="server"></span><o:p></o:p></span></div> <div class="MsoNormal" style="border: none; margin-bottom: 0.0001pt; padding: 0in;"> <span style="font-family: Consolas; font-size: 9.5pt;">    <span style="color: blue;"><</span><span style="color: maroon;">div</span> <span style="color: red;">id</span><span style="color: blue;">="DivArea"></span><o:p></o:p></span></div> <div class="MsoNormal" style="border: none; margin-bottom: 0.0001pt; padding: 0in;"> <span style="font-family: Consolas; font-size: 9.5pt;">        <span style="color: blue;"><</span><span style="color: maroon;">asp</span><span style="color: blue;">:</span><span style="color: maroon;">Button</span> <span style="color: red;">ID</span><span style="color: blue;">="btnBeforeConflict"</span> <span style="color: red;">runat</span><span style="color: blue;">="server"</span> <span style="color: red;">Text</span><span style="color: blue;">="Before Conflict()"</span> <span style="color: blue;">/></span><o:p></o:p></span></div> <div class="MsoNormal" style="border: none; margin-bottom: 0.0001pt; padding: 0in;"> <span style="font-family: Consolas; font-size: 9.5pt;">        <span style="color: blue;"><</span><span style="color: maroon;">asp</span><span style="color: blue;">:</span><span style="color: maroon;">Button</span> <span style="color: red;">ID</span><span style="color: blue;">="btnAfterConflict"</span> <span style="color: red;">runat</span><span style="color: blue;">="server"</span> <span style="color: red;">Text</span><span style="color: blue;">="After Conflict()"</span> <span style="color: blue;">/></span><o:p></o:p></span></div> <div class="MsoNormal" style="border: none; margin-bottom: 0.0001pt; padding: 0in;"> <span style="font-family: Consolas; font-size: 9.5pt;">    <span style="color: blue;"></</span><span style="color: maroon;">div</span><span style="color: blue;">></span><o:p></o:p></span></div> <div class="MsoNormal" style="border: none; margin-bottom: 0.0001pt; padding: 0in;"> <span style="font-family: Consolas; font-size: 9.5pt;">    <span style="color: blue;"></</span><span style="color: maroon;">form</span><span style="color: blue;">></span><o:p></o:p></span></div> <div class="MsoNormal" style="border: none; margin-bottom: 0.0001pt; padding: 0in;"> <span style="color: blue; font-family: Consolas; font-size: 9.5pt;"></</span><span style="color: maroon; font-family: Consolas; font-size: 9.5pt;">body</span><span style="color: blue; font-family: Consolas; font-size: 9.5pt;">></span><span style="font-family: Consolas; font-size: 9.5pt;"><o:p></o:p></span></div> <div class="MsoNormal" style="border: none; margin-bottom: 0.0001pt; padding: 0in;"> <span style="color: blue; font-family: Consolas; font-size: 9.5pt;"></</span><span style="color: maroon; font-family: Consolas; font-size: 9.5pt;">html</span><span style="color: blue; font-family: Consolas; font-size: 9.5pt;">><o:p></o:p></span></div> </div> <div style="background: white; line-height: 13.5pt; margin-bottom: .0001pt; margin: 0in;"> <br /></div> <div style="background: white; line-height: 13.5pt; margin-bottom: .0001pt; margin: 0in;"> <b><span style="font-family: "Verdana","sans-serif"; font-size: 10.0pt;">$.browser</span></b><span style="font-family: "Verdana","sans-serif"; font-size: 10.0pt;"> property is removed in version Jquery 1.10.2. But we can use the property in jquery 1.3.0.<o:p></o:p></span></div> <div style="background: white; line-height: 13.5pt; margin-bottom: .0001pt; margin: 0in;"> <br /></div> <div style="background: white; line-height: 13.5pt; margin-bottom: .0001pt; margin: 0in;"> <span style="font-family: "Verdana","sans-serif"; font-size: 10.0pt;">In our scenario, we are updating our webpage with latest jquery version. We need an old version also. For this, we are using conflict() method.</span></div> <div style="background: white; line-height: 13.5pt; margin-bottom: .0001pt; margin: 0in;"> <br /></div> <br /> <div style="background: white; line-height: 13.5pt; margin-bottom: .0001pt; margin: 0in;"> <span style="font-family: "Verdana","sans-serif"; font-size: 10.0pt;">In the above example, first click event will not work. It will throw an error. Because, $.browser property is removed in version 1.10.2. Next click event will work with conflict() method. Because, $.browser property called from the version 1.3.0.<o:p></o:p></span></div> </div>

How to add multiple version of jquery on the same page?

Introduction: In this article, I will explain how to add multiple version of jquery on the same page. If you are working on a webs...

Read more »

How to go back to previous page using Jquery?

<div dir="ltr" style="text-align: left;" trbidi="on"> <div class="MsoNormal"> <div style="margin-bottom: .0001pt; margin: 0in;"> <b><u><span style="color: #595959; font-family: "Verdana","sans-serif"; font-size: 10.0pt;">Description:</span></u></b><b><u><span style="font-family: Verdana, sans-serif; font-size: 10pt;"><o:p></o:p></span></u></b></div> <div style="margin-bottom: .0001pt; margin: 0in;"> <br /></div> <div style="margin-bottom: .0001pt; margin: 0in;"> <span style="font-family: "Verdana","sans-serif"; font-size: 10.0pt; mso-bidi-font-weight: bold;">In this article, I will explain how to go back to previous page using Jquery. <o:p></o:p></span></div> <div style="margin-bottom: .0001pt; margin: 0in;"> <br /></div> <div style="margin-bottom: .0001pt; margin: 0in;"> <span style="font-family: Verdana, sans-serif; font-size: 10pt;">History object is used to contain the Url visited by the user. <o:p></o:p></span></div> <div style="margin-bottom: .0001pt; margin: 0in;"> <br /></div> <div style="margin-bottom: .0001pt; margin: 0in;"> <span style="font-family: Verdana, sans-serif; font-size: 10pt;">History.back() method is used to navigate to the previous Url from the browser history.<o:p></o:p></span></div> <div style="margin-bottom: .0001pt; margin: 0in;"> <br /></div> <div style="margin-bottom: .0001pt; margin: 0in;"> <span style="font-family: Verdana, sans-serif; font-size: 10pt;">History.forward() method is used to navigate to the next page from the browser history.<o:p></o:p></span></div> <div style="margin-bottom: .0001pt; margin: 0in;"> <br /></div> <div style="margin-bottom: .0001pt; margin: 0in;"> <b><u><span style="color: #595959; font-family: "Verdana","sans-serif"; font-size: 10.0pt;">Example Program:</span></u></b><b><u><span style="font-family: Verdana, sans-serif; font-size: 10pt;"><o:p></o:p></span></u></b></div> <div style="margin-bottom: .0001pt; margin: 0in;"> <br /></div> <div style="border: solid windowtext 1.0pt; mso-border-alt: solid windowtext .5pt; mso-element: para-border-div; padding: 1.0pt 4.0pt 1.0pt 4.0pt;"> <div style="border: none; margin-bottom: .0001pt; margin: 0in; mso-border-alt: solid windowtext .5pt; mso-padding-alt: 1.0pt 4.0pt 1.0pt 4.0pt; padding: 0in;"> <span style="color: blue; font-family: Consolas; font-size: 9.5pt;"><</span><span style="color: maroon; font-family: Consolas; font-size: 9.5pt;">html</span><span class="apple-converted-space"><span style="font-family: Consolas; font-size: 9.5pt;"> </span></span><span style="color: red; font-family: Consolas; font-size: 9.5pt;">xmlns</span><span style="color: blue; font-family: Consolas; font-size: 9.5pt;">="http://www.w3.org/1999/xhtml"></span><span style="font-size: 13.5pt;"><o:p></o:p></span></div> <u1:p></u1:p> <div style="border: none; margin-bottom: .0001pt; margin: 0in; mso-border-alt: solid windowtext .5pt; mso-padding-alt: 1.0pt 4.0pt 1.0pt 4.0pt; padding: 0in;"> <span style="color: blue; font-family: Consolas; font-size: 9.5pt;"><</span><span style="color: maroon; font-family: Consolas; font-size: 9.5pt;">head</span><span class="apple-converted-space"><span style="font-family: Consolas; font-size: 9.5pt;"> </span></span><span style="color: red; font-family: Consolas; font-size: 9.5pt;">id</span><span style="color: blue; font-family: Consolas; font-size: 9.5pt;">="Head1"</span><span class="apple-converted-space"><span style="font-family: Consolas; font-size: 9.5pt;"> </span></span><span style="color: red; font-family: Consolas; font-size: 9.5pt;">runat</span><span style="color: blue; font-family: Consolas; font-size: 9.5pt;">="server"></span><span style="font-size: 13.5pt;"><o:p></o:p></span></div> <u1:p></u1:p> <div style="border: none; margin-bottom: .0001pt; margin: 0in; mso-border-alt: solid windowtext .5pt; mso-padding-alt: 1.0pt 4.0pt 1.0pt 4.0pt; padding: 0in;"> <span style="font-family: Consolas; font-size: 9.5pt;">   <span class="apple-converted-space"> </span></span><span style="color: blue; font-family: Consolas; font-size: 9.5pt;"><</span><span style="color: maroon; font-family: Consolas; font-size: 9.5pt;">title</span><span style="color: blue; font-family: Consolas; font-size: 9.5pt;">></</span><span style="color: maroon; font-family: Consolas; font-size: 9.5pt;">title</span><span style="color: blue; font-family: Consolas; font-size: 9.5pt;">></span><span style="font-size: 13.5pt;"><o:p></o:p></span></div> <u1:p></u1:p> <div style="border: none; margin-bottom: .0001pt; margin: 0in; mso-border-alt: solid windowtext .5pt; mso-padding-alt: 1.0pt 4.0pt 1.0pt 4.0pt; padding: 0in;"> <span style="font-family: Consolas; font-size: 9.5pt;">   <span class="apple-converted-space"> </span></span><span style="color: blue; font-family: Consolas; font-size: 9.5pt;"><</span><span style="color: maroon; font-family: Consolas; font-size: 9.5pt;">script</span><span class="apple-converted-space"><span style="font-family: Consolas; font-size: 9.5pt;"> </span></span><span style="color: red; font-family: Consolas; font-size: 9.5pt;">type</span><span style="color: blue; font-family: Consolas; font-size: 9.5pt;">="text/javascript"</span><span class="apple-converted-space"><span style="font-family: Consolas; font-size: 9.5pt;"> </span></span><span style="color: red; font-family: Consolas; font-size: 9.5pt;">src</span><span style="color: blue; font-family: Consolas; font-size: 9.5pt;">="http://ajax.googleapis.com/ajax/libs/jquery/1.10.2/jquery.min.js"></span><span style="font-size: 13.5pt;"><o:p></o:p></span></div> <u1:p></u1:p> <div style="border: none; margin-bottom: .0001pt; margin: 0in; mso-border-alt: solid windowtext .5pt; mso-padding-alt: 1.0pt 4.0pt 1.0pt 4.0pt; padding: 0in;"> <span style="font-family: Consolas; font-size: 9.5pt;">   <span class="apple-converted-space"> </span></span><span style="color: blue; font-family: Consolas; font-size: 9.5pt;"></</span><span style="color: maroon; font-family: Consolas; font-size: 9.5pt;">script</span><span style="color: blue; font-family: Consolas; font-size: 9.5pt;">></span><span style="font-size: 13.5pt;"><o:p></o:p></span></div> <u1:p></u1:p> <div style="border: none; margin-bottom: .0001pt; margin: 0in; mso-border-alt: solid windowtext .5pt; mso-padding-alt: 1.0pt 4.0pt 1.0pt 4.0pt; padding: 0in;"> <span style="font-family: Consolas; font-size: 9.5pt;">   <span class="apple-converted-space"> </span></span><span style="color: blue; font-family: Consolas; font-size: 9.5pt;"><</span><span style="color: maroon; font-family: Consolas; font-size: 9.5pt;">script</span><span class="apple-converted-space"><span style="font-family: Consolas; font-size: 9.5pt;"> </span></span><span style="color: red; font-family: Consolas; font-size: 9.5pt;">type</span><span style="color: blue; font-family: Consolas; font-size: 9.5pt;">="text/javascript"></span><span style="font-size: 13.5pt;"><o:p></o:p></span></div> <u1:p></u1:p> <div style="border: none; margin-bottom: .0001pt; margin: 0in; mso-border-alt: solid windowtext .5pt; mso-padding-alt: 1.0pt 4.0pt 1.0pt 4.0pt; padding: 0in;"> <span style="font-family: Consolas; font-size: 9.5pt;">        $(document).ready(</span><span style="color: blue; font-family: Consolas; font-size: 9.5pt;">function</span><span class="apple-converted-space"><span style="font-family: Consolas; font-size: 9.5pt;"> </span></span><span style="font-family: Consolas; font-size: 9.5pt;">() {</span><span style="font-size: 13.5pt;"><o:p></o:p></span></div> <u1:p></u1:p> <div style="border: none; margin-bottom: .0001pt; margin: 0in; mso-border-alt: solid windowtext .5pt; mso-padding-alt: 1.0pt 4.0pt 1.0pt 4.0pt; padding: 0in;"> <span style="font-family: Consolas; font-size: 9.5pt;">            $(</span><span style="color: maroon; font-family: Consolas; font-size: 9.5pt;">'#btnPrevPage'</span><span style="font-family: Consolas; font-size: 9.5pt;">).click(</span><span style="color: blue; font-family: Consolas; font-size: 9.5pt;">function</span><span class="apple-converted-space"><span style="font-family: Consolas; font-size: 9.5pt;"> </span></span><span style="font-family: Consolas; font-size: 9.5pt;">() {</span><span style="font-size: 13.5pt;"><o:p></o:p></span></div> <u1:p></u1:p> <div style="border: none; margin-bottom: .0001pt; margin: 0in; mso-border-alt: solid windowtext .5pt; mso-padding-alt: 1.0pt 4.0pt 1.0pt 4.0pt; padding: 0in;"> <span style="font-family: Consolas; font-size: 9.5pt;">                history.back();</span><span style="font-size: 13.5pt;"><o:p></o:p></span></div> <u1:p></u1:p> <div style="border: none; margin-bottom: .0001pt; margin: 0in; mso-border-alt: solid windowtext .5pt; mso-padding-alt: 1.0pt 4.0pt 1.0pt 4.0pt; padding: 0in;"> <span style="font-family: Consolas; font-size: 9.5pt;">                </span><span style="color: blue; font-family: Consolas; font-size: 9.5pt;">return</span><span class="apple-converted-space"><span style="font-family: Consolas; font-size: 9.5pt;"> </span></span><span style="color: blue; font-family: Consolas; font-size: 9.5pt;">false</span><span style="font-family: Consolas; font-size: 9.5pt;">;</span><span style="font-size: 13.5pt;"><o:p></o:p></span></div> <u1:p></u1:p> <div style="border: none; margin-bottom: .0001pt; margin: 0in; mso-border-alt: solid windowtext .5pt; mso-padding-alt: 1.0pt 4.0pt 1.0pt 4.0pt; padding: 0in;"> <span style="font-family: Consolas; font-size: 9.5pt;">            });</span><span style="font-size: 13.5pt;"><o:p></o:p></span></div> <u1:p></u1:p> <div style="border: none; margin-bottom: .0001pt; margin: 0in; mso-border-alt: solid windowtext .5pt; mso-padding-alt: 1.0pt 4.0pt 1.0pt 4.0pt; padding: 0in;"> <span style="font-family: Consolas; font-size: 9.5pt;">        });</span><span style="font-size: 13.5pt;"><o:p></o:p></span></div> <u1:p></u1:p> <div style="border: none; margin-bottom: .0001pt; margin: 0in; mso-border-alt: solid windowtext .5pt; mso-padding-alt: 1.0pt 4.0pt 1.0pt 4.0pt; padding: 0in;"> <span style="font-family: Consolas; font-size: 9.5pt;">   <span class="apple-converted-space"> </span></span><span style="color: blue; font-family: Consolas; font-size: 9.5pt;"></</span><span style="color: maroon; font-family: Consolas; font-size: 9.5pt;">script</span><span style="color: blue; font-family: Consolas; font-size: 9.5pt;">></span><span style="font-size: 13.5pt;"><o:p></o:p></span></div> <u1:p></u1:p> <div style="border: none; margin-bottom: .0001pt; margin: 0in; mso-border-alt: solid windowtext .5pt; mso-padding-alt: 1.0pt 4.0pt 1.0pt 4.0pt; padding: 0in;"> <span style="color: blue; font-family: Consolas; font-size: 9.5pt;"></</span><span style="color: maroon; font-family: Consolas; font-size: 9.5pt;">head</span><span style="color: blue; font-family: Consolas; font-size: 9.5pt;">></span><span style="font-size: 13.5pt;"><o:p></o:p></span></div> <u1:p></u1:p> <div style="border: none; margin-bottom: .0001pt; margin: 0in; mso-border-alt: solid windowtext .5pt; mso-padding-alt: 1.0pt 4.0pt 1.0pt 4.0pt; padding: 0in;"> <span style="color: blue; font-family: Consolas; font-size: 9.5pt;"><</span><span style="color: maroon; font-family: Consolas; font-size: 9.5pt;">body</span><span style="color: blue; font-family: Consolas; font-size: 9.5pt;">></span><span style="font-size: 13.5pt;"><o:p></o:p></span></div> <u1:p></u1:p> <div style="border: none; margin-bottom: .0001pt; margin: 0in; mso-border-alt: solid windowtext .5pt; mso-padding-alt: 1.0pt 4.0pt 1.0pt 4.0pt; padding: 0in;"> <span style="font-family: Consolas; font-size: 9.5pt;">   <span class="apple-converted-space"> </span></span><span style="color: blue; font-family: Consolas; font-size: 9.5pt;"><</span><span style="color: maroon; font-family: Consolas; font-size: 9.5pt;">form</span><span class="apple-converted-space"><span style="font-family: Consolas; font-size: 9.5pt;"> </span></span><span style="color: red; font-family: Consolas; font-size: 9.5pt;">id</span><span style="color: blue; font-family: Consolas; font-size: 9.5pt;">="form1"</span><span class="apple-converted-space"><span style="font-family: Consolas; font-size: 9.5pt;"> </span></span><span style="color: red; font-family: Consolas; font-size: 9.5pt;">runat</span><span style="color: blue; font-family: Consolas; font-size: 9.5pt;">="server"></span><span style="font-size: 13.5pt;"><o:p></o:p></span></div> <u1:p></u1:p> <div style="border: none; margin-bottom: .0001pt; margin: 0in; mso-border-alt: solid windowtext .5pt; mso-padding-alt: 1.0pt 4.0pt 1.0pt 4.0pt; padding: 0in;"> <span style="font-family: Consolas; font-size: 9.5pt;">   <span class="apple-converted-space"> </span></span><span style="color: blue; font-family: Consolas; font-size: 9.5pt;"><</span><span style="color: maroon; font-family: Consolas; font-size: 9.5pt;">div</span><span style="color: blue; font-family: Consolas; font-size: 9.5pt;">></span><span style="font-size: 13.5pt;"><o:p></o:p></span></div> <u1:p></u1:p> <div style="border: none; margin-bottom: .0001pt; margin: 0in; mso-border-alt: solid windowtext .5pt; mso-padding-alt: 1.0pt 4.0pt 1.0pt 4.0pt; padding: 0in;"> <span style="font-family: Consolas; font-size: 9.5pt;">        </span><span style="color: blue; font-family: Consolas; font-size: 9.5pt;"><</span><span style="color: maroon; font-family: Consolas; font-size: 9.5pt;">asp</span><span style="color: blue; font-family: Consolas; font-size: 9.5pt;">:</span><span style="color: maroon; font-family: Consolas; font-size: 9.5pt;">Button</span><span class="apple-converted-space"><span style="font-family: Consolas; font-size: 9.5pt;"> </span></span><span style="color: red; font-family: Consolas; font-size: 9.5pt;">ID</span><span style="color: blue; font-family: Consolas; font-size: 9.5pt;">="btnPrevPage"</span><span class="apple-converted-space"><span style="font-family: Consolas; font-size: 9.5pt;"> </span></span><span style="color: red; font-family: Consolas; font-size: 9.5pt;">runat</span><span style="color: blue; font-family: Consolas; font-size: 9.5pt;">="server"</span><span class="apple-converted-space"><span style="font-family: Consolas; font-size: 9.5pt;"> </span></span><span style="color: red; font-family: Consolas; font-size: 9.5pt;">Text</span><span style="color: blue; font-family: Consolas; font-size: 9.5pt;">="Go back"</span><span class="apple-converted-space"><span style="font-family: Consolas; font-size: 9.5pt;"> </span></span><span style="color: blue; font-family: Consolas; font-size: 9.5pt;">/></span><span style="font-size: 13.5pt;"><o:p></o:p></span></div> <div style="border: none; margin-bottom: .0001pt; margin: 0in; mso-border-alt: solid windowtext .5pt; mso-padding-alt: 1.0pt 4.0pt 1.0pt 4.0pt; padding: 0in;"> <span style="font-family: Consolas; font-size: 9.5pt;">   <span class="apple-converted-space"> </span></span><span style="color: blue; font-family: Consolas; font-size: 9.5pt;"></</span><span style="color: maroon; font-family: Consolas; font-size: 9.5pt;">div</span><span style="color: blue; font-family: Consolas; font-size: 9.5pt;">></span><span style="font-size: 13.5pt;"><o:p></o:p></span></div> <u1:p></u1:p> <div style="border: none; margin-bottom: .0001pt; margin: 0in; mso-border-alt: solid windowtext .5pt; mso-padding-alt: 1.0pt 4.0pt 1.0pt 4.0pt; padding: 0in;"> <span style="font-family: Consolas; font-size: 9.5pt;">   <span class="apple-converted-space"> </span></span><span style="color: blue; font-family: Consolas; font-size: 9.5pt;"></</span><span style="color: maroon; font-family: Consolas; font-size: 9.5pt;">form</span><span style="color: blue; font-family: Consolas; font-size: 9.5pt;">></span><span style="font-size: 13.5pt;"><o:p></o:p></span></div> <u1:p></u1:p> <div style="border: none; margin-bottom: .0001pt; margin: 0in; mso-border-alt: solid windowtext .5pt; mso-padding-alt: 1.0pt 4.0pt 1.0pt 4.0pt; padding: 0in;"> <span style="color: blue; font-family: Consolas; font-size: 9.5pt;"></</span><span style="color: maroon; font-family: Consolas; font-size: 9.5pt;">body</span><span style="color: blue; font-family: Consolas; font-size: 9.5pt;">></span><span style="font-size: 13.5pt;"><o:p></o:p></span></div> <u1:p></u1:p> <div style="border: none; margin: 0in 0in 0.0001pt; padding: 0in;"> <span style="color: blue; font-family: Consolas; font-size: 9.5pt;"></</span><span style="color: maroon; font-family: Consolas; font-size: 9.5pt;">html</span><span style="color: blue; font-family: Consolas; font-size: 9.5pt;">></span><span style="font-size: 13.5pt;"><o:p></o:p></span></div> </div> <div style="background: white; line-height: 13.5pt; margin-bottom: .0001pt; margin: 0in;"> <br /></div> <div style="background: white; line-height: 13.5pt; margin-bottom: .0001pt; margin: 0in;"> <span style="font-family: Verdana, sans-serif; font-size: 10pt;">In the above example, I am navigating to previous url on click event.<o:p></o:p></span></div> <div style="background: white; line-height: 13.5pt; margin-bottom: .0001pt; margin: 0in;"> <br /></div> <u1:p></u1:p> <u1:p></u1:p> <u1:p></u1:p> <u1:p></u1:p><br /> <div style="margin-bottom: .0001pt; margin: 0in;"> <span style="font-family: "Verdana","sans-serif"; font-size: 10.0pt; mso-bidi-font-weight: bold;"><u>Back to previous page with jquery, Return to previous page using Jquery, History.back method using Jquery, back to the previous page using Jquery, Jquery return to previous page, Browser back button navigation, How to get previous page using Jquery</u></span><span style="font-family: "Verdana","sans-serif"; font-size: 10.0pt;"><o:p></o:p></span></div> </div> </div>

How to go back to previous page using Jquery?

Description: In this article, I will explain how to go back to previous page using Jquery.  History object is used to contain the...

Read more »

How to scroll smoothly to specific position using Jquery?

<div dir="ltr" style="text-align: left;" trbidi="on"> <div class="MsoNormal"> <div class="MsoNormal" style="margin-bottom: 0.0001pt;"> <span style="font-family: "Verdana","sans-serif"; font-size: 10.0pt; mso-bidi-font-family: "Times New Roman"; mso-bidi-font-weight: bold; mso-fareast-font-family: "Times New Roman";">In this article, I will explain how to scroll to particular position using Jquery. <o:p></o:p></span></div> <div class="MsoNormal" style="margin-bottom: 0.0001pt;"> <br /></div> <div style="background: white; line-height: 13.5pt; margin-bottom: .0001pt; margin: 0in;"> <b><u><span style="font-family: "Verdana","sans-serif"; font-size: 10.0pt;">Description:</span></u></b></div> <div style="background: white; line-height: 13.5pt; margin-bottom: .0001pt; margin: 0in;"> <b><u><span style="font-family: "Verdana","sans-serif"; font-size: 10.0pt;"><br /></span></u></b></div> <div style="background: white; line-height: 13.5pt; margin-bottom: .0001pt; margin: 0in;"> <span style="font-family: "Verdana","sans-serif"; font-size: 10.0pt; mso-bidi-font-weight: bold;">Jquery introduced the concept of smooth scrolling and it became very popular day by day that lot of websites is using it.<o:p></o:p></span></div> <div style="background: white; line-height: 13.5pt; margin-bottom: .0001pt; margin: 0in;"> <br /></div> <div style="background: white; line-height: 13.5pt; margin-bottom: .0001pt; margin: 0in;"> <span style="font-family: "Verdana","sans-serif"; font-size: 10.0pt; mso-bidi-font-weight: bold;">Scrolling creates better effects to the visitors.<o:p></o:p></span></div> <div style="background: white; line-height: 13.5pt; margin-bottom: .0001pt; margin: 0in;"> <br /></div> <div style="background: white; line-height: 13.5pt; margin-bottom: .0001pt; margin: 0in;"> <span style="font-family: "Verdana","sans-serif"; font-size: 10.0pt; mso-bidi-font-weight: bold;">If we click on a link, the page smoothly scrolls down to a specific section of content. <o:p></o:p></span></div> <div style="background: white; line-height: 13.5pt; margin-bottom: .0001pt; margin: 0in;"> <br /></div> <div style="background: white; line-height: 13.5pt; margin-bottom: .0001pt; margin: 0in;"> <span style="font-family: "Verdana","sans-serif"; font-size: 10.0pt; mso-bidi-font-weight: bold;">Smooth scrolling reduces efforts of visitors to scroll up to a specific area of page, rather than doing this if we just click on a link jquery will take care where the user wants to land.<o:p></o:p></span></div> <div style="background: white; line-height: 13.5pt; margin-bottom: .0001pt; margin: 0in;"> <br /></div> <div class="MsoNormal" style="margin-bottom: 0.0001pt;"> <span style="font-family: "Verdana","sans-serif"; font-size: 10.0pt; mso-bidi-font-weight: bold;">The Jquery function scrollTop() used to animate the page and scroll up or down to the specific location.<o:p></o:p></span></div> <div class="MsoNormal" style="margin-bottom: 0.0001pt;"> <br /></div> <div style="background: white; line-height: 13.5pt; margin-bottom: .0001pt; margin: 0in;"> <span style="font-family: "Verdana","sans-serif"; font-size: 10.0pt; mso-bidi-font-weight: bold;">If we want to scroll to the top of the page, we can use the following code<o:p></o:p></span></div> <div style="background: white; line-height: 13.5pt; margin-bottom: .0001pt; margin: 0in;"> <br /></div> <div class="MsoNormal" style="margin-bottom: 0.0001pt;"> <span style="font-family: Consolas; font-size: 9.5pt;">$(<span style="color: maroon;">"html, body"</span>).animate({ scrollTop: 0 }, 4000);<o:p></o:p></span></div> <div class="MsoNormal" style="margin-bottom: 0.0001pt;"> <br /></div> <div style="background: white; line-height: 13.5pt; margin-bottom: .0001pt; margin: 0in;"> <span style="font-family: "Verdana","sans-serif"; font-size: 10.0pt; mso-bidi-font-weight: bold;">If we want to scroll to the bottom of the page, we can use the following code<o:p></o:p></span></div> <div style="background: white; line-height: 13.5pt; margin-bottom: .0001pt; margin: 0in;"> <br /></div> <div class="MsoNormal" style="margin-bottom: 0.0001pt;"> <span style="font-family: Consolas; font-size: 9.5pt;">$(<span style="color: maroon;">"html, body"</span>).animate({ scrollTop: $(document).height() }, 4000);<o:p></o:p></span></div> <div style="background: white; line-height: 13.5pt; margin-bottom: .0001pt; margin: 0in;"> <br /></div> <div style="background: white; line-height: 13.5pt; margin-bottom: .0001pt; margin: 0in;"> <span style="font-family: "Verdana","sans-serif"; font-size: 10.0pt; mso-bidi-font-weight: bold;">If we want to scroll to the particular section of the page, we can use the following code<o:p></o:p></span></div> <div class="MsoNormal" style="margin-bottom: 0.0001pt;"> <br /></div> <div class="MsoNormal" style="margin-bottom: 0.0001pt;"> <span style="font-family: Consolas; font-size: 9.5pt;">$(<span style="color: maroon;">'html, body'</span>).animate({scrollTop: $(divID).offset().top }, 3000);<o:p></o:p></span></div> <div class="MsoNormal" style="margin-bottom: 0.0001pt;"> <br /></div> <div class="MsoNormal" style="margin-bottom: 0.0001pt;"> <b><u><span style="font-family: "Verdana","sans-serif"; font-size: 10.0pt;">Example Program:</span></u></b><b><u><span style="font-family: Consolas; font-size: 9.5pt;"><o:p></o:p></span></u></b></div> <div style="background: white; line-height: 13.5pt; margin-bottom: .0001pt; margin: 0in;"> <br /></div> <div style="border: solid windowtext 1.0pt; mso-border-alt: solid windowtext .5pt; mso-element: para-border-div; padding: 1.0pt 1.0pt 1.0pt 1.0pt;"> <div class="MsoNormal" style="border: none; margin-bottom: 0.0001pt; padding: 0in;"> <span style="color: blue; font-family: Consolas; font-size: 9.5pt; mso-fareast-font-family: "Times New Roman";"><</span><span style="color: maroon; font-family: Consolas; font-size: 9.5pt; mso-fareast-font-family: "Times New Roman";">html</span><span style="font-family: Consolas; font-size: 9.5pt;"> </span><span style="color: red; font-family: Consolas; font-size: 9.5pt; mso-fareast-font-family: "Times New Roman";">xmlns</span><span style="color: blue; font-family: Consolas; font-size: 9.5pt; mso-fareast-font-family: "Times New Roman";">="http://www.w3.org/1999/xhtml"></span><span style="font-family: 'Times New Roman', serif; font-size: 13.5pt;"><o:p></o:p></span></div> <div class="MsoNormal" style="border: none; margin-bottom: 0.0001pt; padding: 0in;"> <span style="color: blue; font-family: Consolas; font-size: 9.5pt; mso-fareast-font-family: "Times New Roman";"><</span><span style="color: maroon; font-family: Consolas; font-size: 9.5pt; mso-fareast-font-family: "Times New Roman";">head</span><span style="font-family: Consolas; font-size: 9.5pt;"> </span><span style="color: red; font-family: Consolas; font-size: 9.5pt; mso-fareast-font-family: "Times New Roman";">id</span><span style="color: blue; font-family: Consolas; font-size: 9.5pt; mso-fareast-font-family: "Times New Roman";">="Head1"</span><span style="font-family: Consolas; font-size: 9.5pt;"> </span><span style="color: red; font-family: Consolas; font-size: 9.5pt; mso-fareast-font-family: "Times New Roman";">runat</span><span style="color: blue; font-family: Consolas; font-size: 9.5pt; mso-fareast-font-family: "Times New Roman";">="server"></span><span style="font-family: 'Times New Roman', serif; font-size: 13.5pt;"><o:p></o:p></span></div> <div class="MsoNormal" style="border: none; margin-bottom: 0.0001pt; padding: 0in;"> <span style="font-family: Consolas; font-size: 9.5pt;">    </span><span style="color: blue; font-family: Consolas; font-size: 9.5pt; mso-fareast-font-family: "Times New Roman";"><</span><span style="color: maroon; font-family: Consolas; font-size: 9.5pt; mso-fareast-font-family: "Times New Roman";">title</span><span style="color: blue; font-family: Consolas; font-size: 9.5pt; mso-fareast-font-family: "Times New Roman";">></span><span style="font-family: Consolas; font-size: 9.5pt;">Smooth Scrolling Div using Jquery</span><span style="color: blue; font-family: Consolas; font-size: 9.5pt; mso-fareast-font-family: "Times New Roman";"></</span><span style="color: maroon; font-family: Consolas; font-size: 9.5pt; mso-fareast-font-family: "Times New Roman";">title</span><span style="color: blue; font-family: Consolas; font-size: 9.5pt; mso-fareast-font-family: "Times New Roman";">></span><span style="font-family: 'Times New Roman', serif; font-size: 13.5pt;"><o:p></o:p></span></div> <div class="MsoNormal" style="border: none; margin-bottom: 0.0001pt; padding: 0in;"> <span style="font-family: Consolas; font-size: 9.5pt;">    </span><span style="color: blue; font-family: Consolas; font-size: 9.5pt; mso-fareast-font-family: "Times New Roman";"><</span><span style="color: maroon; font-family: Consolas; font-size: 9.5pt; mso-fareast-font-family: "Times New Roman";">script</span><span style="font-family: Consolas; font-size: 9.5pt;"> </span><span style="color: red; font-family: Consolas; font-size: 9.5pt; mso-fareast-font-family: "Times New Roman";">type</span><span style="color: blue; font-family: Consolas; font-size: 9.5pt; mso-fareast-font-family: "Times New Roman";">="text/javascript"</span><span style="font-family: Consolas; font-size: 9.5pt;"> </span><span style="color: red; font-family: Consolas; font-size: 9.5pt; mso-fareast-font-family: "Times New Roman";">src</span><span style="color: blue; font-family: Consolas; font-size: 9.5pt; mso-fareast-font-family: "Times New Roman";">="http://ajax.googleapis.com/ajax/libs/jquery/1.3.0/jquery.min.js"></</span><span style="color: maroon; font-family: Consolas; font-size: 9.5pt; mso-fareast-font-family: "Times New Roman";">script</span><span style="color: blue; font-family: Consolas; font-size: 9.5pt; mso-fareast-font-family: "Times New Roman";">></span><span style="font-family: 'Times New Roman', serif; font-size: 13.5pt;"><o:p></o:p></span></div> <div class="MsoNormal" style="border: none; margin-bottom: 0.0001pt; padding: 0in;"> <span style="font-family: Consolas; font-size: 9.5pt;">    </span><span style="color: blue; font-family: Consolas; font-size: 9.5pt; mso-fareast-font-family: "Times New Roman";"><</span><span style="color: maroon; font-family: Consolas; font-size: 9.5pt; mso-fareast-font-family: "Times New Roman";">script</span><span style="font-family: Consolas; font-size: 9.5pt;"> </span><span style="color: red; font-family: Consolas; font-size: 9.5pt; mso-fareast-font-family: "Times New Roman";">type</span><span style="color: blue; font-family: Consolas; font-size: 9.5pt; mso-fareast-font-family: "Times New Roman";">="text/javascript"></span><span style="font-family: 'Times New Roman', serif; font-size: 13.5pt;"><o:p></o:p></span></div> <div class="MsoNormal" style="border: none; margin-bottom: 0.0001pt; padding: 0in;"> <span style="font-family: Consolas; font-size: 9.5pt;">        $(document).ready(</span><span style="color: blue; font-family: Consolas; font-size: 9.5pt; mso-fareast-font-family: "Times New Roman";">function</span><span style="font-family: Consolas; font-size: 9.5pt;"> () {</span><span style="font-family: 'Times New Roman', serif; font-size: 13.5pt;"><o:p></o:p></span></div> <div class="MsoNormal" style="border: none; margin-bottom: 0.0001pt; padding: 0in;"> <span style="font-family: Consolas; font-size: 9.5pt;">            $(</span><span style="color: maroon; font-family: Consolas; font-size: 9.5pt; mso-fareast-font-family: "Times New Roman";">'#DivOne'</span><span style="font-family: Consolas; font-size: 9.5pt;">).click(</span><span style="color: blue; font-family: Consolas; font-size: 9.5pt; mso-fareast-font-family: "Times New Roman";">function</span><span style="font-family: Consolas; font-size: 9.5pt;"> () {</span><span style="font-family: 'Times New Roman', serif; font-size: 13.5pt;"><o:p></o:p></span></div> <div class="MsoNormal" style="border: none; margin-bottom: 0.0001pt; padding: 0in;"> <span style="font-family: Consolas; font-size: 9.5pt;">                </span><span style="color: blue; font-family: Consolas; font-size: 9.5pt; mso-fareast-font-family: "Times New Roman";">var</span><span style="font-family: Consolas; font-size: 9.5pt;"> divID = </span><span style="color: maroon; font-family: Consolas; font-size: 9.5pt; mso-fareast-font-family: "Times New Roman";">'#FirstDiv'</span><span style="font-family: Consolas; font-size: 9.5pt;">;</span><span style="font-family: 'Times New Roman', serif; font-size: 13.5pt;"><o:p></o:p></span></div> <div class="MsoNormal" style="border: none; margin-bottom: 0.0001pt; padding: 0in;"> <span style="font-family: Consolas; font-size: 9.5pt;">                $(</span><span style="color: maroon; font-family: Consolas; font-size: 9.5pt; mso-fareast-font-family: "Times New Roman";">'html, body'</span><span style="font-family: Consolas; font-size: 9.5pt;">).animate({</span><span style="font-family: 'Times New Roman', serif; font-size: 13.5pt;"><o:p></o:p></span></div> <div class="MsoNormal" style="border: none; margin-bottom: 0.0001pt; padding: 0in;"> <span style="font-family: Consolas; font-size: 9.5pt;">                    scrollTop: $(divID).offset().top</span><span style="font-family: 'Times New Roman', serif; font-size: 13.5pt;"><o:p></o:p></span></div> <div class="MsoNormal" style="border: none; margin-bottom: 0.0001pt; padding: 0in;"> <span style="font-family: Consolas; font-size: 9.5pt;">                }, 3000);</span><span style="font-family: 'Times New Roman', serif; font-size: 13.5pt;"><o:p></o:p></span></div> <div class="MsoNormal" style="border: none; margin-bottom: 0.0001pt; padding: 0in;"> <span style="font-family: Consolas; font-size: 9.5pt;">            });</span><span style="font-family: 'Times New Roman', serif; font-size: 13.5pt;"><o:p></o:p></span></div> <div class="MsoNormal" style="border: none; margin-bottom: 0.0001pt; padding: 0in;"> <span style="font-family: Consolas; font-size: 9.5pt;">            $(</span><span style="color: maroon; font-family: Consolas; font-size: 9.5pt; mso-fareast-font-family: "Times New Roman";">'#DivTwo'</span><span style="font-family: Consolas; font-size: 9.5pt;">).click(</span><span style="color: blue; font-family: Consolas; font-size: 9.5pt; mso-fareast-font-family: "Times New Roman";">function</span><span style="font-family: Consolas; font-size: 9.5pt;"> () {</span><span style="font-family: 'Times New Roman', serif; font-size: 13.5pt;"><o:p></o:p></span></div> <div class="MsoNormal" style="border: none; margin-bottom: 0.0001pt; padding: 0in;"> <span style="font-family: Consolas; font-size: 9.5pt;">                </span><span style="color: blue; font-family: Consolas; font-size: 9.5pt; mso-fareast-font-family: "Times New Roman";">var</span><span style="font-family: Consolas; font-size: 9.5pt;"> divID = </span><span style="color: maroon; font-family: Consolas; font-size: 9.5pt; mso-fareast-font-family: "Times New Roman";">'#SecondDiv'</span><span style="font-family: Consolas; font-size: 9.5pt;">;</span><span style="font-family: 'Times New Roman', serif; font-size: 13.5pt;"><o:p></o:p></span></div> <div class="MsoNormal" style="border: none; margin-bottom: 0.0001pt; padding: 0in;"> <span style="font-family: Consolas; font-size: 9.5pt;">                $(</span><span style="color: maroon; font-family: Consolas; font-size: 9.5pt; mso-fareast-font-family: "Times New Roman";">'html, body'</span><span style="font-family: Consolas; font-size: 9.5pt;">).animate({</span><span style="font-family: 'Times New Roman', serif; font-size: 13.5pt;"><o:p></o:p></span></div> <div class="MsoNormal" style="border: none; margin-bottom: 0.0001pt; padding: 0in;"> <span style="font-family: Consolas; font-size: 9.5pt;">                    scrollTop: $(divID).offset().top</span><span style="font-family: 'Times New Roman', serif; font-size: 13.5pt;"><o:p></o:p></span></div> <div class="MsoNormal" style="border: none; margin-bottom: 0.0001pt; padding: 0in;"> <span style="font-family: Consolas; font-size: 9.5pt;">                }, 3000);</span><span style="font-family: 'Times New Roman', serif; font-size: 13.5pt;"><o:p></o:p></span></div> <div class="MsoNormal" style="border: none; margin-bottom: 0.0001pt; padding: 0in;"> <span style="font-family: Consolas; font-size: 9.5pt;">            });</span><span style="font-family: 'Times New Roman', serif; font-size: 13.5pt;"><o:p></o:p></span></div> <div class="MsoNormal" style="border: none; margin-bottom: 0.0001pt; padding: 0in;"> <span style="font-family: Consolas; font-size: 9.5pt;">            $(</span><span style="color: maroon; font-family: Consolas; font-size: 9.5pt; mso-fareast-font-family: "Times New Roman";">'#DivThree'</span><span style="font-family: Consolas; font-size: 9.5pt;">).click(</span><span style="color: blue; font-family: Consolas; font-size: 9.5pt; mso-fareast-font-family: "Times New Roman";">function</span><span style="font-family: Consolas; font-size: 9.5pt;"> () {</span><span style="font-family: 'Times New Roman', serif; font-size: 13.5pt;"><o:p></o:p></span></div> <div class="MsoNormal" style="border: none; margin-bottom: 0.0001pt; padding: 0in;"> <span style="font-family: Consolas; font-size: 9.5pt;">                </span><span style="color: blue; font-family: Consolas; font-size: 9.5pt; mso-fareast-font-family: "Times New Roman";">var</span><span style="font-family: Consolas; font-size: 9.5pt;"> divID = </span><span style="color: maroon; font-family: Consolas; font-size: 9.5pt; mso-fareast-font-family: "Times New Roman";">'#ThirdDiv'</span><span style="font-family: Consolas; font-size: 9.5pt;">;</span><span style="font-family: 'Times New Roman', serif; font-size: 13.5pt;"><o:p></o:p></span></div> <div class="MsoNormal" style="border: none; margin-bottom: 0.0001pt; padding: 0in;"> <span style="font-family: Consolas; font-size: 9.5pt;">                $(</span><span style="color: maroon; font-family: Consolas; font-size: 9.5pt; mso-fareast-font-family: "Times New Roman";">'html, body'</span><span style="font-family: Consolas; font-size: 9.5pt;">).animate({</span><span style="font-family: 'Times New Roman', serif; font-size: 13.5pt;"><o:p></o:p></span></div> <div class="MsoNormal" style="border: none; margin-bottom: 0.0001pt; padding: 0in;"> <span style="font-family: Consolas; font-size: 9.5pt;">                    scrollTop: $(divID).offset().top</span><span style="font-family: 'Times New Roman', serif; font-size: 13.5pt;"><o:p></o:p></span></div> <div class="MsoNormal" style="border: none; margin-bottom: 0.0001pt; padding: 0in;"> <span style="font-family: Consolas; font-size: 9.5pt;">                }, 3000);</span><span style="font-family: 'Times New Roman', serif; font-size: 13.5pt;"><o:p></o:p></span></div> <div class="MsoNormal" style="border: none; margin-bottom: 0.0001pt; padding: 0in;"> <span style="font-family: Consolas; font-size: 9.5pt;">            });</span><span style="font-family: 'Times New Roman', serif; font-size: 13.5pt;"><o:p></o:p></span></div> <div class="MsoNormal" style="border: none; margin-bottom: 0.0001pt; padding: 0in;"> <span style="font-family: Consolas; font-size: 9.5pt;">        });</span><span style="font-family: 'Times New Roman', serif; font-size: 13.5pt;"><o:p></o:p></span></div> <div class="MsoNormal" style="border: none; margin-bottom: 0.0001pt; padding: 0in;"> <span style="font-family: Consolas; font-size: 9.5pt;">    </span><span style="color: blue; font-family: Consolas; font-size: 9.5pt; mso-fareast-font-family: "Times New Roman";"></</span><span style="color: maroon; font-family: Consolas; font-size: 9.5pt; mso-fareast-font-family: "Times New Roman";">script</span><span style="color: blue; font-family: Consolas; font-size: 9.5pt; mso-fareast-font-family: "Times New Roman";">></span><span style="font-family: 'Times New Roman', serif; font-size: 13.5pt;"><o:p></o:p></span></div> <div class="MsoNormal" style="border: none; margin-bottom: 0.0001pt; padding: 0in;"> <span style="color: blue; font-family: Consolas; font-size: 9.5pt; mso-fareast-font-family: "Times New Roman";"></</span><span style="color: maroon; font-family: Consolas; font-size: 9.5pt; mso-fareast-font-family: "Times New Roman";">head</span><span style="color: blue; font-family: Consolas; font-size: 9.5pt; mso-fareast-font-family: "Times New Roman";">></span><span style="font-family: 'Times New Roman', serif; font-size: 13.5pt;"><o:p></o:p></span></div> <div class="MsoNormal" style="border: none; margin-bottom: 0.0001pt; padding: 0in;"> <span style="color: blue; font-family: Consolas; font-size: 9.5pt; mso-fareast-font-family: "Times New Roman";"><</span><span style="color: maroon; font-family: Consolas; font-size: 9.5pt; mso-fareast-font-family: "Times New Roman";">body</span><span style="color: blue; font-family: Consolas; font-size: 9.5pt; mso-fareast-font-family: "Times New Roman";">></span><span style="font-family: 'Times New Roman', serif; font-size: 13.5pt;"><o:p></o:p></span></div> <div class="MsoNormal" style="border: none; margin-bottom: 0.0001pt; padding: 0in;"> <span style="font-family: Consolas; font-size: 9.5pt;">    </span><span style="color: blue; font-family: Consolas; font-size: 9.5pt; mso-fareast-font-family: "Times New Roman";"><</span><span style="color: maroon; font-family: Consolas; font-size: 9.5pt; mso-fareast-font-family: "Times New Roman";">form</span><span style="font-family: Consolas; font-size: 9.5pt;"> </span><span style="color: red; font-family: Consolas; font-size: 9.5pt; mso-fareast-font-family: "Times New Roman";">id</span><span style="color: blue; font-family: Consolas; font-size: 9.5pt; mso-fareast-font-family: "Times New Roman";">="form1"</span><span style="font-family: Consolas; font-size: 9.5pt;"> </span><span style="color: red; font-family: Consolas; font-size: 9.5pt; mso-fareast-font-family: "Times New Roman";">runat</span><span style="color: blue; font-family: Consolas; font-size: 9.5pt; mso-fareast-font-family: "Times New Roman";">="server"></span><span style="font-family: 'Times New Roman', serif; font-size: 13.5pt;"><o:p></o:p></span></div> <div class="MsoNormal" style="border: none; margin-bottom: 0.0001pt; padding: 0in;"> <span style="font-family: Consolas; font-size: 9.5pt;">    </span><span style="color: blue; font-family: Consolas; font-size: 9.5pt; mso-fareast-font-family: "Times New Roman";"><</span><span style="color: maroon; font-family: Consolas; font-size: 9.5pt; mso-fareast-font-family: "Times New Roman";">div</span><span style="color: blue; font-family: Consolas; font-size: 9.5pt; mso-fareast-font-family: "Times New Roman";">></span><span style="font-family: 'Times New Roman', serif; font-size: 13.5pt;"><o:p></o:p></span></div> <div class="MsoNormal" style="border: none; margin-bottom: 0.0001pt; padding: 0in;"> <span style="font-family: Consolas; font-size: 9.5pt;">        </span><span style="color: blue; font-family: Consolas; font-size: 9.5pt; mso-fareast-font-family: "Times New Roman";"><</span><span style="color: maroon; font-family: Consolas; font-size: 9.5pt; mso-fareast-font-family: "Times New Roman";">a</span><span style="font-family: Consolas; font-size: 9.5pt;"> </span><span style="color: red; font-family: Consolas; font-size: 9.5pt; mso-fareast-font-family: "Times New Roman";">href</span><span style="color: blue; font-family: Consolas; font-size: 9.5pt; mso-fareast-font-family: "Times New Roman";">="#"</span><span style="font-family: Consolas; font-size: 9.5pt;"> </span><span style="color: red; font-family: Consolas; font-size: 9.5pt; mso-fareast-font-family: "Times New Roman";">id</span><span style="color: blue; font-family: Consolas; font-size: 9.5pt; mso-fareast-font-family: "Times New Roman";">="DivOne"></span><span style="font-family: Consolas; font-size: 9.5pt;">Go to Div One</span><span style="color: blue; font-family: Consolas; font-size: 9.5pt; mso-fareast-font-family: "Times New Roman";"></</span><span style="color: maroon; font-family: Consolas; font-size: 9.5pt; mso-fareast-font-family: "Times New Roman";">a</span><span style="color: blue; font-family: Consolas; font-size: 9.5pt; mso-fareast-font-family: "Times New Roman";">></span><span style="font-family: Consolas; font-size: 9.5pt;"> </span></div> <div class="MsoNormal" style="border: none; margin-bottom: 0.0001pt; padding: 0in;"> <span style="color: blue; font-family: Consolas; font-size: 9.5pt; mso-fareast-font-family: "Times New Roman";">        <</span><span style="color: maroon; font-family: Consolas; font-size: 9.5pt; mso-fareast-font-family: "Times New Roman";">a</span><span style="font-family: Consolas; font-size: 9.5pt;"> </span><span style="color: red; font-family: Consolas; font-size: 9.5pt; mso-fareast-font-family: "Times New Roman";">href</span><span style="color: blue; font-family: Consolas; font-size: 9.5pt; mso-fareast-font-family: "Times New Roman";">="#"</span><span style="font-family: Consolas; font-size: 9.5pt;"> </span><span style="color: red; font-family: Consolas; font-size: 9.5pt; mso-fareast-font-family: "Times New Roman";">id</span><span style="color: blue; font-family: Consolas; font-size: 9.5pt; mso-fareast-font-family: "Times New Roman";">="DivTwo"></span><span style="font-family: Consolas; font-size: 9.5pt;">Go to Div Two</span><span style="color: blue; font-family: Consolas; font-size: 9.5pt; mso-fareast-font-family: "Times New Roman";"></</span><span style="color: maroon; font-family: Consolas; font-size: 9.5pt; mso-fareast-font-family: "Times New Roman";">a</span><span style="color: blue; font-family: Consolas; font-size: 9.5pt; mso-fareast-font-family: "Times New Roman";">></span><span style="font-family: 'Times New Roman', serif; font-size: 13.5pt;"><o:p></o:p></span></div> <div class="MsoNormal" style="border: none; margin-bottom: 0.0001pt; padding: 0in;"> <span style="font-family: Consolas; font-size: 9.5pt;">        </span><span style="color: blue; font-family: Consolas; font-size: 9.5pt; mso-fareast-font-family: "Times New Roman";"><</span><span style="color: maroon; font-family: Consolas; font-size: 9.5pt; mso-fareast-font-family: "Times New Roman";">a</span><span style="font-family: Consolas; font-size: 9.5pt;"> </span><span style="color: red; font-family: Consolas; font-size: 9.5pt; mso-fareast-font-family: "Times New Roman";">href</span><span style="color: blue; font-family: Consolas; font-size: 9.5pt; mso-fareast-font-family: "Times New Roman";">="#"</span><span style="font-family: Consolas; font-size: 9.5pt;"> </span><span style="color: red; font-family: Consolas; font-size: 9.5pt; mso-fareast-font-family: "Times New Roman";">id</span><span style="color: blue; font-family: Consolas; font-size: 9.5pt; mso-fareast-font-family: "Times New Roman";">="DivThree"></span><span style="font-family: Consolas; font-size: 9.5pt;">Go to Div Three</span><span style="color: blue; font-family: Consolas; font-size: 9.5pt; mso-fareast-font-family: "Times New Roman";"></</span><span style="color: maroon; font-family: Consolas; font-size: 9.5pt; mso-fareast-font-family: "Times New Roman";">a</span><span style="color: blue; font-family: Consolas; font-size: 9.5pt; mso-fareast-font-family: "Times New Roman";">></span><span style="font-family: 'Times New Roman', serif; font-size: 13.5pt;"><o:p></o:p></span></div> <div class="MsoNormal" style="border: none; margin-bottom: 0.0001pt; padding: 0in;"> <span style="font-family: Consolas; font-size: 9.5pt;">        </span><span style="color: blue; font-family: Consolas; font-size: 9.5pt; mso-fareast-font-family: "Times New Roman";"><</span><span style="color: maroon; font-family: Consolas; font-size: 9.5pt; mso-fareast-font-family: "Times New Roman";">div</span><span style="font-family: Consolas; font-size: 9.5pt;"> </span><span style="color: red; font-family: Consolas; font-size: 9.5pt; mso-fareast-font-family: "Times New Roman";">id</span><span style="color: blue; font-family: Consolas; font-size: 9.5pt; mso-fareast-font-family: "Times New Roman";">="FirstDiv"></span><span style="font-family: 'Times New Roman', serif; font-size: 13.5pt;"><o:p></o:p></span></div> <div class="MsoNormal" style="border: none; margin-bottom: 0.0001pt; padding: 0in;"> <span style="font-family: Consolas; font-size: 9.5pt;">            </span><span style="color: blue; font-family: Consolas; font-size: 9.5pt; mso-fareast-font-family: "Times New Roman";"><</span><span style="color: maroon; font-family: Consolas; font-size: 9.5pt; mso-fareast-font-family: "Times New Roman";">h1</span><span style="color: blue; font-family: Consolas; font-size: 9.5pt; mso-fareast-font-family: "Times New Roman";">></span><span style="font-family: 'Times New Roman', serif; font-size: 13.5pt;"><o:p></o:p></span></div> <div class="MsoNormal" style="border: none; margin-bottom: 0.0001pt; padding: 0in;"> <span style="font-family: Consolas; font-size: 9.5pt;">                First Div</span><span style="color: blue; font-family: Consolas; font-size: 9.5pt; mso-fareast-font-family: "Times New Roman";"></</span><span style="color: maroon; font-family: Consolas; font-size: 9.5pt; mso-fareast-font-family: "Times New Roman";">h1</span><span style="color: blue; font-family: Consolas; font-size: 9.5pt; mso-fareast-font-family: "Times New Roman";">></span><span style="font-family: 'Times New Roman', serif; font-size: 13.5pt;"><o:p></o:p></span></div> <div class="MsoNormal" style="border: none; margin-bottom: 0.0001pt; padding: 0in;"> <span style="font-family: Consolas; font-size: 9.5pt;">            Add some Sample Paragraph here</span><span style="font-family: 'Times New Roman', serif; font-size: 13.5pt;"><o:p></o:p></span></div> <div class="MsoNormal" style="border: none; margin-bottom: 0.0001pt; padding: 0in;"> <span style="font-family: Consolas; font-size: 9.5pt;">            </span><span style="color: blue; font-family: Consolas; font-size: 9.5pt; mso-fareast-font-family: "Times New Roman";"><</span><span style="color: maroon; font-family: Consolas; font-size: 9.5pt; mso-fareast-font-family: "Times New Roman";">br</span><span style="font-family: Consolas; font-size: 9.5pt;"> </span><span style="color: blue; font-family: Consolas; font-size: 9.5pt; mso-fareast-font-family: "Times New Roman";">/></span><span style="font-family: 'Times New Roman', serif; font-size: 13.5pt;"><o:p></o:p></span></div> <div class="MsoNormal" style="border: none; margin-bottom: 0.0001pt; padding: 0in;"> <span style="font-family: Consolas; font-size: 9.5pt;">        </span><span style="color: blue; font-family: Consolas; font-size: 9.5pt; mso-fareast-font-family: "Times New Roman";"></</span><span style="color: maroon; font-family: Consolas; font-size: 9.5pt; mso-fareast-font-family: "Times New Roman";">div</span><span style="color: blue; font-family: Consolas; font-size: 9.5pt; mso-fareast-font-family: "Times New Roman";">></span><span style="font-family: 'Times New Roman', serif; font-size: 13.5pt;"><o:p></o:p></span></div> <div class="MsoNormal" style="border: none; margin-bottom: 0.0001pt; padding: 0in;"> <span style="font-family: Consolas; font-size: 9.5pt;">        </span><span style="color: blue; font-family: Consolas; font-size: 9.5pt; mso-fareast-font-family: "Times New Roman";"><</span><span style="color: maroon; font-family: Consolas; font-size: 9.5pt; mso-fareast-font-family: "Times New Roman";">div</span><span style="font-family: Consolas; font-size: 9.5pt;"> </span><span style="color: red; font-family: Consolas; font-size: 9.5pt; mso-fareast-font-family: "Times New Roman";">id</span><span style="color: blue; font-family: Consolas; font-size: 9.5pt; mso-fareast-font-family: "Times New Roman";">="SecondDiv"></span><span style="font-family: 'Times New Roman', serif; font-size: 13.5pt;"><o:p></o:p></span></div> <div class="MsoNormal" style="border: none; margin-bottom: 0.0001pt; padding: 0in;"> <span style="font-family: Consolas; font-size: 9.5pt;">            </span><span style="color: blue; font-family: Consolas; font-size: 9.5pt; mso-fareast-font-family: "Times New Roman";"><</span><span style="color: maroon; font-family: Consolas; font-size: 9.5pt; mso-fareast-font-family: "Times New Roman";">h1</span><span style="color: blue; font-family: Consolas; font-size: 9.5pt; mso-fareast-font-family: "Times New Roman";">></span><span style="font-family: 'Times New Roman', serif; font-size: 13.5pt;"><o:p></o:p></span></div> <div class="MsoNormal" style="border: none; margin-bottom: 0.0001pt; padding: 0in;"> <span style="font-family: Consolas; font-size: 9.5pt;">                Second Div</span><span style="color: blue; font-family: Consolas; font-size: 9.5pt; mso-fareast-font-family: "Times New Roman";"></</span><span style="color: maroon; font-family: Consolas; font-size: 9.5pt; mso-fareast-font-family: "Times New Roman";">h1</span><span style="color: blue; font-family: Consolas; font-size: 9.5pt; mso-fareast-font-family: "Times New Roman";">></span><span style="font-family: 'Times New Roman', serif; font-size: 13.5pt;"><o:p></o:p></span></div> <div class="MsoNormal" style="border: none; margin-bottom: 0.0001pt; padding: 0in;"> <span style="font-family: Consolas; font-size: 9.5pt;">            Add some Sample Paragraph here</span><span style="font-family: 'Times New Roman', serif; font-size: 13.5pt;"><o:p></o:p></span></div> <div class="MsoNormal" style="border: none; margin-bottom: 0.0001pt; padding: 0in;"> <span style="font-family: Consolas; font-size: 9.5pt;">            </span><span style="color: blue; font-family: Consolas; font-size: 9.5pt; mso-fareast-font-family: "Times New Roman";"><</span><span style="color: maroon; font-family: Consolas; font-size: 9.5pt; mso-fareast-font-family: "Times New Roman";">br</span><span style="font-family: Consolas; font-size: 9.5pt;"> </span><span style="color: blue; font-family: Consolas; font-size: 9.5pt; mso-fareast-font-family: "Times New Roman";">/></span><span style="font-family: 'Times New Roman', serif; font-size: 13.5pt;"><o:p></o:p></span></div> <div class="MsoNormal" style="border: none; margin-bottom: 0.0001pt; padding: 0in;"> <span style="font-family: Consolas; font-size: 9.5pt;">        </span><span style="color: blue; font-family: Consolas; font-size: 9.5pt; mso-fareast-font-family: "Times New Roman";"></</span><span style="color: maroon; font-family: Consolas; font-size: 9.5pt; mso-fareast-font-family: "Times New Roman";">div</span><span style="color: blue; font-family: Consolas; font-size: 9.5pt; mso-fareast-font-family: "Times New Roman";">></span><span style="font-family: 'Times New Roman', serif; font-size: 13.5pt;"><o:p></o:p></span></div> <div class="MsoNormal" style="border: none; margin-bottom: 0.0001pt; padding: 0in;"> <span style="font-family: Consolas; font-size: 9.5pt;">        </span><span style="color: blue; font-family: Consolas; font-size: 9.5pt; mso-fareast-font-family: "Times New Roman";"><</span><span style="color: maroon; font-family: Consolas; font-size: 9.5pt; mso-fareast-font-family: "Times New Roman";">div</span><span style="font-family: Consolas; font-size: 9.5pt;"> </span><span style="color: red; font-family: Consolas; font-size: 9.5pt; mso-fareast-font-family: "Times New Roman";">id</span><span style="color: blue; font-family: Consolas; font-size: 9.5pt; mso-fareast-font-family: "Times New Roman";">="ThirdDiv"></span><span style="font-family: 'Times New Roman', serif; font-size: 13.5pt;"><o:p></o:p></span></div> <div class="MsoNormal" style="border: none; margin-bottom: 0.0001pt; padding: 0in;"> <span style="font-family: Consolas; font-size: 9.5pt;">            </span><span style="color: blue; font-family: Consolas; font-size: 9.5pt; mso-fareast-font-family: "Times New Roman";"><</span><span style="color: maroon; font-family: Consolas; font-size: 9.5pt; mso-fareast-font-family: "Times New Roman";">h1</span><span style="color: blue; font-family: Consolas; font-size: 9.5pt; mso-fareast-font-family: "Times New Roman";">></span><span style="font-family: 'Times New Roman', serif; font-size: 13.5pt;"><o:p></o:p></span></div> <div class="MsoNormal" style="border: none; margin-bottom: 0.0001pt; padding: 0in;"> <span style="font-family: Consolas; font-size: 9.5pt;">                Third Div</span><span style="color: blue; font-family: Consolas; font-size: 9.5pt; mso-fareast-font-family: "Times New Roman";"></</span><span style="color: maroon; font-family: Consolas; font-size: 9.5pt; mso-fareast-font-family: "Times New Roman";">h1</span><span style="color: blue; font-family: Consolas; font-size: 9.5pt; mso-fareast-font-family: "Times New Roman";">></span><span style="font-family: 'Times New Roman', serif; font-size: 13.5pt;"><o:p></o:p></span></div> <div class="MsoNormal" style="border: none; margin-bottom: 0.0001pt; padding: 0in;"> <span style="font-family: Consolas; font-size: 9.5pt;">            Add some Sample Paragraph here</span><span style="font-family: 'Times New Roman', serif; font-size: 13.5pt;"><o:p></o:p></span></div> <div class="MsoNormal" style="border: none; margin-bottom: 0.0001pt; padding: 0in;"> <span style="font-family: Consolas; font-size: 9.5pt;">            </span><span style="color: blue; font-family: Consolas; font-size: 9.5pt; mso-fareast-font-family: "Times New Roman";"><</span><span style="color: maroon; font-family: Consolas; font-size: 9.5pt; mso-fareast-font-family: "Times New Roman";">br</span><span style="font-family: Consolas; font-size: 9.5pt;"> </span><span style="color: blue; font-family: Consolas; font-size: 9.5pt; mso-fareast-font-family: "Times New Roman";">/></span><span style="font-family: 'Times New Roman', serif; font-size: 13.5pt;"><o:p></o:p></span></div> <div class="MsoNormal" style="border: none; margin-bottom: 0.0001pt; padding: 0in;"> <span style="font-family: Consolas; font-size: 9.5pt;">        </span><span style="color: blue; font-family: Consolas; font-size: 9.5pt; mso-fareast-font-family: "Times New Roman";"></</span><span style="color: maroon; font-family: Consolas; font-size: 9.5pt; mso-fareast-font-family: "Times New Roman";">div</span><span style="color: blue; font-family: Consolas; font-size: 9.5pt; mso-fareast-font-family: "Times New Roman";">></span><span style="font-family: 'Times New Roman', serif; font-size: 13.5pt;"><o:p></o:p></span></div> <div class="MsoNormal" style="border: none; margin-bottom: 0.0001pt; padding: 0in;"> <span style="font-family: Consolas; font-size: 9.5pt;">    </span><span style="color: blue; font-family: Consolas; font-size: 9.5pt; mso-fareast-font-family: "Times New Roman";"></</span><span style="color: maroon; font-family: Consolas; font-size: 9.5pt; mso-fareast-font-family: "Times New Roman";">div</span><span style="color: blue; font-family: Consolas; font-size: 9.5pt; mso-fareast-font-family: "Times New Roman";">></span><span style="font-family: 'Times New Roman', serif; font-size: 13.5pt;"><o:p></o:p></span></div> <div class="MsoNormal" style="border: none; margin-bottom: 0.0001pt; padding: 0in;"> <span style="font-family: Consolas; font-size: 9.5pt;">    </span><span style="color: blue; font-family: Consolas; font-size: 9.5pt; mso-fareast-font-family: "Times New Roman";"></</span><span style="color: maroon; font-family: Consolas; font-size: 9.5pt; mso-fareast-font-family: "Times New Roman";">form</span><span style="color: blue; font-family: Consolas; font-size: 9.5pt; mso-fareast-font-family: "Times New Roman";">></span><span style="font-family: 'Times New Roman', serif; font-size: 13.5pt;"><o:p></o:p></span></div> <div class="MsoNormal" style="border: none; margin-bottom: 0.0001pt; padding: 0in;"> <span style="color: blue; font-family: Consolas; font-size: 9.5pt; mso-fareast-font-family: "Times New Roman";"></</span><span style="color: maroon; font-family: Consolas; font-size: 9.5pt; mso-fareast-font-family: "Times New Roman";">body</span><span style="color: blue; font-family: Consolas; font-size: 9.5pt; mso-fareast-font-family: "Times New Roman";">></span><span style="font-family: 'Times New Roman', serif; font-size: 13.5pt;"><o:p></o:p></span></div> <div class="MsoNormal" style="border: none; margin-bottom: 0.0001pt; padding: 0in;"> <span style="color: blue; font-family: Consolas; font-size: 9.5pt; mso-fareast-font-family: "Times New Roman";"></</span><span style="color: maroon; font-family: Consolas; font-size: 9.5pt; mso-fareast-font-family: "Times New Roman";">html</span><span style="color: blue; font-family: Consolas; font-size: 9.5pt; mso-fareast-font-family: "Times New Roman";">></span><span style="font-family: 'Times New Roman', serif; font-size: 13.5pt;"><o:p></o:p></span></div> </div> <div style="background: white; line-height: 13.5pt; margin-bottom: .0001pt; margin: 0in;"> <br /></div> <br /> <div style="background: white; line-height: 13.5pt; margin-bottom: .0001pt; margin: 0in;"> <span style="font-family: "Verdana","sans-serif"; font-size: 10.0pt; mso-bidi-font-weight: bold;">From the above example, we can smoothly scroll to particular div based on the link click event.<o:p></o:p></span></div> </div> </div>

How to scroll smoothly to specific position using Jquery?

In this article, I will explain how to scroll to particular position using Jquery.  Description: Jquery introduced the concept of...

Read more »