Effect
Example 1
code is as follows |
copy code |
<script type=" Text/javascript "src=" http://code.jquery.com/ Jquery-latest.js "></script> <script> $ (function () { var elm = $ (' #pordAt TR '); var startpos = $ (Elm). Offset (). Top; $.event.add (window, "scroll", function () { var p = $ (window). scrolltop (); $ (Elm). css (' position ', (P) > Startpos)? ' Fixed ': ' Static '; $ (Elm). CSS (' top ', (P) > Startpos)? ' 0px ': '); }); }); </script> |
Example 2
The code is as follows |
Copy Code |
$ (function () {
//gets the distance from the top of the browser to locate the element var NAVH = $ (". Nav"). Offset (). Top; //scroll bar Event $ (window). Scroll (function () { //Gets the sliding distance of the scroll bar var Scroh = $ (this). ScrollTop (); The sliding distance of the//scroll bar is greater than or equal to the distance from the top of the browser, the position is fixed, and the opposite is not fixed. if (SCROH>=NAVH) { $ (". Nav"). css ({"Position": "Fixed", "Top": 0}); }else if (SCROH<NAVH) { $ (". Nav"). css ({"position": "Static"}); •} •}) •}) |
This way we can scroll without any user scrolling as long as we have a fixed position.