Jump to content

User:BrandonXLF/ToTopButton.js

From Wikipedia, the free encyclopedia
This is an old revision of this page, as edited by BrandonXLF (talk | contribs) at 12:52, 18 April 2019 (Created page with '// Adds a floating "go to top" button on the bottom-right of the screen // Documentation at User:BrandonXLF/TopButton $(function() { importStylesheet('User...'). The present address (URL) is a permanent link to this revision, which may differ significantly from the current revision.
(diff) ← Previous revision | Latest revision (diff) | Newer revision → (diff)
Note: After saving, you have to bypass your browser's cache to see the changes. Google Chrome, Firefox, Microsoft Edge and Safari: Hold down the ⇧ Shift key and click the Reload toolbar button. For details and instructions about other browsers, see Wikipedia:Bypass your cache.
// Adds a floating "go to top" button on the bottom-right of the screen
// Documentation at [[User:BrandonXLF/TopButton]]

$(function() {
	importStylesheet('User:BrandonXLF/sandbox.css');
	
	var circle = $('<div>')
		.appendTo('body')
		.addClass('topButtonCircle')
		.on('click', function(){
			$('html, body').animate({scrollTop: 0},'slow');
		})
		.append($('<div>').addClass('topButtonTriangle'))
	;
	
	$(window).scroll(function () {
		if ( $(window).scrollTop() > 100 ) {
			circle.fadeIn();
		} else {
			circle.fadeOut();
		}
	});
});