Skip to content

Instantly share code, notes, and snippets.

@raphaelchaib
Last active December 15, 2015 06:09
Show Gist options
  • Save raphaelchaib/5213759 to your computer and use it in GitHub Desktop.
Save raphaelchaib/5213759 to your computer and use it in GitHub Desktop.
jQuery: Scroll sidebar with window. (It's necessary that the sidebar it's absolute positioned and have a wrapper with absolute position too)
jQuery(document).ready(function() {
var page = jQuery('.single.post');
var sidebar = jQuery('.single.post .scrolling-sidebar');
var content = jQuery('.single.post .content');
// Scroll with screen
var top = sidebar.offset().top;
var limit = top + page.height() - sidebar.height();
// Define sidebar-wrapper height
jQuery('.single.post .scrolling-sidebar-wrapper').css({
height : page.css('height')
});
jQuery(window).scroll(function() {
// what the y position of the scroll is
var y = jQuery(this).scrollTop();
// whether that's below
if ( y >= top && y <= limit ) {
// if so, ad the fixed class
sidebar.addClass('fixed');
sidebar.removeClass('bottom');
} else if ( y >= limit ) {
sidebar.addClass('bottom');
sidebar.removeClass('fixed');
} else {
// otherwise remove it
sidebar.removeClass('fixed bottom');
}
});
});
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment