javascript - Sticky Menu in JS -


Everyone,

I have implemented a script that makes sticky while scrolling my menu . The

function works, though it starts behaving strangely suddenly when scrolling back - instead of returning to its original location, it stays very high.

This is the reason I have to change something, but I can not understand it.

Menu / script is on.

I really appreciate any help. Thanks!

Script:

  & lt; Script type = 'text / javascript' & gt; JQuery (document) .scroll (function () {if (jQuery (this) .scrollTop ()> 175) {jQuery (Menu-Secondary-rap & amp; # 39;) CSS (& Amp;; & # 39; Status & amp; # 39;, & amp; # 39; Fixed & amp; # 39;); jQuery (& amp; # 39; Menu-Secondary-Wrap & amp; # 39; CSS (& amp; # 39; Top & amp; # 39; & amp; # 39; & amp; # 39;); jQuery (& amp; # 39; Menu-Secondary-Rap & amp; # 39; ) CSS (& amp; # 39; Width & amp; # 39 ;, & # 39; 950px & amp; # 39;); jQuery (& amp; # 39; Menu-Secondary-Wrap & amp; # 39; CSS (& amp; # 39; Box-Shadow & amp; # 39; 0 -2px 6px 2px # 555 & amp; # 39;);} and {jQuery (& .; Menu -Media-rap & amp; # 39;) CSS (& amp; # 39; Status & amp; # 39 ;, & Amp; # 39; Fixed & amp; # 39;;}}}); & lt; / script & gt;  

I would recommend separating CSS and JavaScript. AddClass / removeClass methods to add or remove specific CSS classes. Additionally I store the distance from the menu in a variable by using a element.offset on top of the document; .

CSS

 . Stable {status: fixed; Top: 0; Width: 950px; Box-Shadow: 0-2 pixel 6px 2px # 555; }  

jQuery

  & lt; Script src = "// ajax.googleapis.com/ajax/libs/jquery/1.9.1/jquery.min .js" & gt; & Lt; / Script & gt; & Lt; Script & gt; Window.jquire || Document.write ('& lt; script src = "js / jquery.min.js" & gt; & lt; / script & gt;') & lt; / Script & gt; & Lt; Script type = 'text / javascript' & gt; Var $ menu = $ ('menu-secondary-rap'); Var menu_top = $ menu.offset () Top; $ (Document) .scroll (function () {if ($ (window) .scrollTop ()> menu_top) {$ menu.addClass ('static');} and {$ menu.removeClass ('static'); }}); & Lt; / Script & gt;  

I have put together. Hope it helps!


Comments

Popular posts from this blog

import - Python ImportError: No module named wmi -

Editing Python Class in Shell and SQLAlchemy -

c# - MySQL Parameterized Select Query joining tables issue -