https://vltk.ru/design/VLKT_6/js/stickySidebar.js

1(function ($) {
2
3    $.fn.stickySidebar = function (options) {
4
5        var config = $.extend({
6            headerSelector: '.navbar',
7            navSelector: 'nav',
8            contentSelector: 'main',
9            footerSelector: 'footer',
10            sidebarTopMargin: 84,
11            footerThreshold: 120
12        }, options);
13
14        var fixSidebr = function () {
15
16            var sidebarSelector = $(this);
17            var viewportHeight = $(window).height();
18            var viewportWidth = $(window).width();
19            var documentHeight = $(document).height();
20            var headerHeight = $(config.headerSelector).outerHeight();
21            var navHeight = $(config.navSelector).outerHeight();
22            var sidebarHeight = sidebarSelector.outerHeight();
23            var contentHeight = $(config.contentSelector).outerHeight();
24            var footerHeight = $(config.footerSelector).outerHeight();
25            var scroll_top = $(window).scrollTop();
26            var fixPosition = contentHeight - sidebarHeight;
27            var breakingPoint1 = headerHeight + navHeight;
28            var breakingPoint2 = documentHeight - (sidebarHeight + footerHeight + config.footerThreshold);
29
30            // calculate
31            if ((contentHeight > sidebarHeight) && (viewportHeight > sidebarHeight)) {
32
33                if (scroll_top < breakingPoint1) {
34
35                    sidebarSelector.removeClass('sticky');
36
37                } else if ((scroll_top >= breakingPoint1) && (scroll_top < breakingPoint2)) {
38
39                    sidebarSelector.addClass('sticky').css('top', config.sidebarTopMargin);
40
41                } else {
42
43                    var negative = breakingPoint2 - scroll_top;
44                    sidebarSelector.addClass('sticky').css('top', negative);
45
46                }
47
48            }
49        };
50
51        return this.each(function () {
52            $(window).on('scroll', $.proxy(fixSidebr, this));
53            $(window).on('resize', $.proxy(fixSidebr, this))
54            $.proxy(fixSidebr, this)();
55        });
56
57    };
58
59}(jQuery));