ACT scroll to top code

//  ACT SCROLL TO TOP
/* ======================================= v 0.1.0
 @ left		css			the left position
 @ bottom	css			the bottom position
 @ color	color		the arrow color
 @ back		color		the background color
 @ font		css			the font family
   ======================================= */
function ACTscrollToTop( left, bottom, color, back, font ){
	left   = left   || 'calc(100% - 64px)';
	bottom = bottom || '16px';
	color  = color  || 'white';
	back   = back   || 'blue';
	font   = font   || 'Arial, sans-serif';
	
	if ( $('.ACT-arrow-to-top').length > 0 ) return;
	
	$('<div class="ACT-arrow-to-top">').html('>').css({
		position    : 'fixed',
		left        : left,
		bottom      : bottom,
		background  : back,
		color       : color,
		padding     : '8px 12px 12px',
		transform   : 'rotate(-90deg) scale(1)',
		cursor      : 'pointer',
		'z-index'   : 9999,
		'box-shadow': '-4px 4px 8px hsla(0, 0%, 0%, 0.3)',
		'font-size'	: '20px',
		'font-family'   : font,
		'font-weight'   : '700',
		'border-radius' : '7px',
	}).appendTo( 'body' ).hide();
	
	$('.ACT-arrow-to-top').click(function(){
		$('html,body').animate({ scrollTop: 0 }, 700);
	})
	
	$(window).scroll(function(){
		var WH = $(window).height();

		if ( $('html,body').scrollTop() > WH )
			$('.ACT-arrow-to-top').fadeIn(600);
		else
			$('.ACT-arrow-to-top').fadeOut(1000);

	})

}

Leave a Reply

Your email address will not be published. Required fields are marked *