Skip to content

Instantly share code, notes, and snippets.

@prabeengiri

prabeengiri/sticky_sidebar.js

Created December 14, 2015 06:03
Show Gist options

  • Select an option

    Learn more about clone URLs
  • Save prabeengiri/1d5b2a3507e697c65a5d to your computer and use it in GitHub Desktop.

Select an option

Learn more about clone URLs
Save prabeengiri/1d5b2a3507e697c65a5d to your computer and use it in GitHub Desktop.
Download ZIP
JQuery Sticky Sidebar
Raw
sticky_sidebar.js
$.fn.stickySideBar = function () {
var $el = $(this);
var $sidebar_is_fixed = false;
var $sidebar_height = $el.height();
var $sidebar_width = $el.width();
if ($el.offset() == undefined) {
return;
}
var $sidebar_top = $el.offset().top;
var $scroll_fix_pos = ($sidebar_top + $sidebar_height) - $(window).height();
var $window_scroll_top = null;
$(window).scroll(function() {
if ($(this).scrollTop() >= $scroll_fix_pos && !$sidebar_is_fixed) {
$window_scroll_top = $(window).scrollTop();
$sidebar_is_fixed = true;
var $top = (-1 * parseInt($window_scroll_top)) + $sidebar_top;
$el.css({position: 'fixed', top : $top, width: $sidebar_width });
}
else if ($sidebar_is_fixed && $(window).scrollTop() <= $window_scroll_top) {
$sidebar_is_fixed = false;
$el.css({position: 'initial', top : 'initial', width: 'initial' })
}
});
};
$(document).ready(function() {
// Stay fixed while scrolling window if there is no content in the sidebar.
$('.region-sidebar-second').stickySideBar();
});
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment