html - Sticking two div simultaneously to window top using jquery -


i know topic has been discussed here before facing difficulties 1 of problems solved. want stick 2 div(s) top @ same time. (e.g: when layer2 sticks top, want layer 2 stick top different height , width) trying stick 1 div not working.

html

<div id="layer1"></div> <div id="sticky-anchor"></div> <div id="layer2"></div> <div id="layer3"></div> 

js

   jquery(document).ready(function($){     $(window).scroll(sticky_relocate);     sticky_relocate();    });                function sticky_relocate(){     var s=$('#layer2');     var pos = s.position();      var window_top = $(window).scrolltop();     var div_top = $('#sticky-anchor').offset().top;      s.html("distance top:" + pos.top + "<br />scroll position: " + window_top);      if(window_top>div_top){         s.addclass('stick');     }     else{         s.removeclass();     }    } 

css

#layer2 { position: absolute;  text-align: left; left: 0px; top: 276px; width: 950px; height: 57px; z-index: 1; }  .stick { position:fixed; top:0; } 

i here , know how should stick 2 divs @ same time. in advance.

js fiddle


Comments

Popular posts from this blog

php - failed to open stream: HTTP request failed! HTTP/1.0 400 Bad Request -

java - How to filter a backspace keyboard input -

java - Show Soft Keyboard when EditText Appears -