Fix Side CTA to Bottom and Top of an Article

October 4, 2016 Uberflip Customer Success

Add this to the JavaScript section of your Hub.

function throttle(callback, limit) {
	var wait = false;
	return function () {
		if (!wait) {
			callback.call();
			wait = true;
			setTimeout(function () {
				wait = false;
			}, limit);
		}
	}
}

function addThisFixScroll() {
	if ($(window).width() > 1101 && $('.entry-wrapper').length) {
		var windowTop = $(window).scrollTop();
		var addThis = $('.addthis_toolbox');
		var sideCta = $('.cta-item-container .cta');
		var addThisH = addThis.height()
		var sideCtaH = sideCta.height()
		var articleTop = $('article .meta-wrapper').eq(0).offset().top;
		var articleBottom = $('article').eq(0).offset().top + $('article').height();
		var topNavBuffer = $('#header').height();
		addThis.css('top', articleTop - windowTop);
		sideCta.css('top', articleTop - windowTop);
		if (windowTop + topNavBuffer > articleTop) {
			addThis.css('top', topNavBuffer);
			sideCta.css('top', topNavBuffer);
		}
		if (windowTop + topNavBuffer + Math.max(addThisH, sideCtaH) > articleBottom) {
			addThis.css('top', articleBottom - sideCtaH - windowTop);
			sideCta.css('top', articleBottom - sideCtaH - windowTop);
		}
	}
}
$(function () {
	$('.cta-item-container .cta,.addthis_toolbox').css({
		transition: "all .2 ease-out"
	})
})
$(window).on('resize scroll scrollstart scrollstop', throttle(function (e) {
	addThisFixScroll();
}, 12));

```
Previous Article
Put a Flipbook Below an Article
Put a Flipbook Below an Article

Next Article
How to get embedded Flipbooks to open in Expanded Mode
How to get embedded Flipbooks to open in Expanded Mode

If you're embedding a Flipbook inside a blog Item, you may have already noticed the 'Open Flipbooks in Expa...