//UPDATED ON 11/6/2017 @ 1:34PM ////////////////////////////////////////////////////////////////////////////////////////////// $(document).ready(function() { }); ////////////////////////////////////////////////////////////////////////////////////////////// $(window).load(function() { //$("body").append('
'); var vStickyTop1 = $('.Sticky1').offset().top; var vStickyTop2 = $('.Sticky2').offset().top; CheckSticky(vStickyTop1, vStickyTop2); //----------------------------------------------- $(window).on( 'scroll', function() { CheckSticky(vStickyTop1, vStickyTop2); }); //----------------------------------------------- $(window).resize(function() { var vContainerHeight = $('.Container').height(); CheckSticky(vStickyTop1, vStickyTop2); }); //----------------------------------------------- }); ////////////////////////////////////////////////////////////////////////////////////////////// ////////////////////////////////////////////////////////////////////////////////////////////// ////////////////////////////////////////////////////////////////////////////////////////////// ////////////////////////////////////////////////////////////////////////////////////////////// ////////////////////////////////////////////////////////////////////////////////////////////// function CheckSticky(vStickyTop1, vStickyTop2) { var vTop = $(window).scrollTop(); var vContainerHeight = $('.Container').height(); var vWindowWidth = $(window).innerWidth(); var vWindowHeight = $(window).innerHeight(); var vStickyHeight1 = $('.Sticky1').height(); var vStickyHeight2 = $('.Sticky2').height(); if (vStickyHeight2 < vStickyHeight1) { MakeSticky('.Sticky2', vStickyTop2, vContainerHeight); }; }; ////////////////////////////////////////////////////////////////////////////////////////////// function MakeSticky(vDiv, vStickyTop, vContainerHeight) { var vPadding = 40; var vTop = $(window).scrollTop(); var vWindowWidth = $(window).innerWidth(); var vWindowHeight = $(window).innerHeight(); var vStickyWidth = $(vDiv).width() + 'px'; var vStickyHeight = $(vDiv).height(); var V1 = vWindowHeight + vTop; var V2 = vStickyTop + vStickyHeight + vPadding; var V3 = vContainerHeight - vWindowHeight + (vPadding * 2); //var vStats = V3 + " = " + vTop; //$('#Stats').html(vStats); if (V1 > V2 && V2 > vWindowHeight + vPadding) { // Stick to the bottom of the column if (V3 <= vTop) { //footer area is in view, make div position absolute $(vDiv).removeAttr("style"); $(vDiv).css('position','absolute'); $(vDiv).css('bottom',vPadding + 'px'); $(vDiv).css('width',vStickyWidth); $('#Stats').html('absolute'); } else { // footer area is hidden and bottom of Sticky is visible $(vDiv).removeAttr("style"); $(vDiv).css('position','fixed'); $(vDiv).css('bottom',(vPadding-10) + 'px'); $(vDiv).css('width',vStickyWidth); $('#Stats').html('fixed'); }; } ; if (V1 < V2 || vWindowWidth < 768) { //remove if screen is wider than 768px $(vDiv).removeAttr("style"); $(vDiv).css('width','100%'); $('#Stats').html('nothing'); }; }; //////////////////////////////////////////////////////////////////////////////////////////////