This is a special effect code that can only judge the fixed DIV layer. With this JQ intelligent code, you can set the fixed display of the navigation bar, sidebar, and any DIV layer; Now, the JQ intelligent judgment fixed navigation bar is used by the Blueleaf station. If you want to see the demo, please pull down the page scroll bar, and you will see that the navigation bar is fixed; To use this code, you need to reference the JS file of the JQ library on the page. Current websites generally reference the JQ library code. If not, open the Template , add<script src to the page header or page position=“ http://libs.baidu.com/ jquery /1.7.1/jquery.min.js" type="text/ javascript "></script>Save the code, which is the successfully referenced JQ library code; please refer to the following instructions for specific JQ intelligent judgment on how to use the fixed navigation bar or sidebar code:
CSS style of topfixed: .topfixed {position:fixed; top:0;left:0;width:100%;z-index:9000;webkit-box-shadow:0px 4px 4px #baacc9;-moz-box-shadow:0px 4px 4px #baacc9;box-shadow: 0px 4px 4px #baacc9;background:#fff; }
JQ code: <script> $(window).scroll(function(){ if($(this).scrollTop()>220){ $('#nav').addClass('topfixed');} else { $('#nav').removeClass('topfixed'); }}); </script> Note: When the drop-down scroll bar is 220px away from the head, a CSS style topfixed will be added to the # nav style DIV layer to make it fixed. 220 in the above code is the distance from the drop-down scroll bar to the head. Please modify how to set it yourself. # nav is the name of the CSV style of the DIV layer you need to fix.
Disclaimer:
Website: Click Copy to share with friends!
All content resources shared by this website, if not noted, are original by Blueleaf. If you need to reprint, please indicate the source; Please contact us in case of infringement Contact handling 。 Please understand!