Skip to content

Instantly share code, notes, and snippets.

@erickarbe
Forked from danott/jquery.scroll-lock.js
Last active December 11, 2015 05:38
Show Gist options
  • Save erickarbe/4553038 to your computer and use it in GitHub Desktop.
Save erickarbe/4553038 to your computer and use it in GitHub Desktop.
Boom. I just modified this plugin to simply add a class to the body tag when the "lockElement" reaches your offset point. This makes using this plugin MUCH easier with responsive designs. Simply utilize it with your media queries.
(function($) {
var defaults = {};
$.fn.fixedscroll = function(opts) {
var options = $.extend(defaults, opts);
var el = $(this);
var lockPosition = options.lockElement.offset().top;
var offsetTop = options.offset.top || 0;
var klass = options.klass;
$(window).bind('load scroll', function(e) {
if ($(window).scrollTop() + offsetTop >= lockPosition) {
$('body').addClass(klass);
} else {
$('body').removeClass(klass);
}
});
};
})(jQuery);
$(document).ready(function() {
$('#subnav').fixedscroll({
'offset': {'top': 110},
'lockElement': $('#content'),
'klass': 'fixed'
});
});
/*
* Plugin developed by Dan Bentley
* @dan_bentley
*
* @danott: Found on http://csswizardry.com/. No licensing information provided, so I will use it
* unless told otherwise by it's author.
*/
(function($) {
var defaults = {};
$.fn.fixedscroll = function(opts) {
var options = $.extend(defaults, opts);
var el = $(this);
if (el.css('position') !== 'fixed') return;
var lockPosition = options.lockElement.offset().top - el.outerHeight();
var offsetTop = options.offset.top || 0;
$(window).bind('load scroll', function(e) {
if ($(window).scrollTop() + offsetTop >= lockPosition) {
el.css({
position: "absolute",
top: lockPosition
});
} else {
el.css({
position: "fixed",
top: offsetTop
});
}
});
};
})(jQuery);
$(document).ready(function() {
$('#header > div').fixedscroll({
'offset': {'top': 75},
'lockElement': $('#comments')
});
});
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment