;(function () { 'use strict'; /** * Sticky. * @namespace */ db.libs.sticky = (function(){ /** * Cached list of all sticky adunits * @memberof db.libs.sticky * @static * @type array **/ var stickies = []; var update = function(){ var scroll = 0; if(window.pageYOffset !== undefined){ scroll = window.pageYOffset; } else { scroll = document.body.scrollTop; } for (var i = 0; i < stickies.length; i++) { var top = parseInt(stickies[i].dataset.top, 10); var bottom = parseInt(stickies[i].dataset.bottom, 10); if(scroll > top && scroll < bottom) { stickies[i].style.width = stickies[i].getBoundingClientRect().width + 'px'; stickies[i].style.position = 'fixed'; stickies[i].style.top = '0'; stickies[i].style.bottom = 'auto'; stickies[i].style.left = stickies[i].dataset.left + 'px'; stickies[i].style.marginRight = 0; } else if (scroll > bottom) { stickies[i].style.position = 'absolute'; stickies[i].style.top = 'auto'; stickies[i].style.bottom = '0'; stickies[i].style.left = document.querySelector('.body-copy').getBoundingClientRect().width + 15 + 'px'; } else { stickies[i].setAttribute('style',''); } } }; var resize = function(){ var top = (window.pageYOffset !== undefined) ? window.pageYOffset : document.body.scrollTop; for (var i = 0; i < stickies.length; i++) { stickies[i].dataset.top = stickies[i].getBoundingClientRect().top + document.body.scrollTop; stickies[i].dataset.left = document.querySelector(stickies[i].dataset.constraint).getBoundingClientRect().left + document.querySelector(stickies[i].dataset.constraint).getBoundingClientRect().width + 15; stickies[i].dataset.bottom = (document.querySelector(stickies[i].dataset.constraint).getBoundingClientRect().top + top) + document.querySelector(stickies[i].dataset.constraint).getBoundingClientRect().height - stickies[i].getBoundingClientRect().height; } }; var init = function(){ stickies = document.querySelectorAll('.sticky'); if(stickies.length){ //Set the initial position for all sticky adunits resize(); window.addEventListener('scroll', function(){ if(window.innerWidth > 1024) window.requestAnimationFrame(update); }); window.addEventListener('resize', function(){ if(window.innerWidth > 1024) window.requestAnimationFrame(resize); }); } }; return { init: init, reflow: function(){} }; })(); })();