MediaWiki:Gadget-scrollUpButton.js

From Apex Legends Wiki
Jump to navigation Jump to search

In other languages: Português do Brasil


CSS and Javascript changes must comply with the wiki design rules.


Note: After saving, you may have to bypass your browser's cache to see the changes.

  • Firefox / Safari: Hold Shift while clicking Reload, or press either Ctrl-F5 or Ctrl-R (⌘-R on a Mac)
  • Google Chrome: Press Ctrl-Shift-R (⌘-Shift-R on a Mac)
  • Internet Explorer: Hold Ctrl while clicking Refresh, or press Ctrl-F5
  • Opera: Go to Menu → Settings (Opera → Preferences on a Mac) and then to Privacy & security → Clear browsing data → Cached images and files.
/* scrollUpButton
* Add a button to scroll up to the top of the current page.
* @rev 4 (2021-05-08)
* @author Kwj2772
* @contributor Perhelion
* Attribution: https://dev.fandom.com/wiki/MediaWiki:ScrollUpButton.js
* No internationalisation required
* <nowiki>
*/
/* global $:false */
$(function () {
'use strict';

var $icon = 'https://apexlegends.wiki.gg/images/thumb/d/d7/Apex_Legends.svg/32px-Apex_Legends.svg.png';

if (!document.implementation.hasFeature('http://www.w3.org/TR/SVG11/feature#Image', '1.1'))
	$icon = 'https://apexlegends.wiki.gg/images/thumb/d/d7/Apex_Legends.svg/32px-Apex_Legends.svg.png';

$icon = $('<img>', {
	src: $icon,
	id: 'scrollUpButton',
	class: 'noprint'
}).css({
		position: 'fixed',
		bottom: '24px',
		right: '18px',
		opacity: 0.7,
		cursor: 'pointer',
		'z-index': '1',
		display: 'none'
	}).on('click', function () {
		// Move to the top of the page
		$('html, body').animate({ scrollTop: 0 }, 660);
	}).on('mouseenter mouseleave', function (e) {
		this.style.opacity = e.type === 'mouseenter' ? 1 : 0.7;
	}).appendTo('body');

$(window).on('scroll', function () {
	// Fade out if you reach the top of the page
	if ($(this).scrollTop() > 60) $icon.fadeIn('slow');
	else $icon.fadeOut('slow');
});

}());
// </nowiki>