jquery - Fixed left navigation after a certain point with sticky header -


i want prototype page sticky header has 'fixed' left navigation.

http://jsfiddle.net/rkr2/r7bh7/1/

html:

<div class="nav-container">     <div class="nav">         <div id="bad"> </div>     </div> </div>  <div id = "container">     <div id = "left"> </div>     <div id = "right"> </div> </div> 

js sticky header:

var nav = $('.nav-container'); $(window).scroll(function () {     if ($(this).scrolltop() > 200) {         if (!nav.hasclass('f-nav')) {             nav.addclass("f-nav");             nav.hide();             nav.slidedown("slow");             $('#bad').css('background-color', 'red');         }     } else {         nav.removeclass("f-nav");         // nav.slideup("slow");         $('#bad').css('background-color', 'yellow');     } }); 

now, want "left" div stay right beneath sticky header post-scrolling(and remain there). how can achieve this?

use stickyfloat plugin.

http://dropthebit.com/demos/stickyfloat/stickyfloat.html

just set offsety setting tall topnav , stay below it.


Comments

Popular posts from this blog

linux - Does gcc have any options to add version info in ELF binary file? -

android - send complex objects as post php java -

charts - What graph/dashboard product is facebook using in Dashboard: PUE & WUE -