MediaWiki:Gadget-backToTop.js - Revision history

Bonez565 at 12:53, 5 January 2026

2026-01-05T12:53:10Z

← Older revision		Revision as of 12:53, 5 January 2026
Line 18:		Line 18:
	// icon + label (label hidden on mobile via CSS)		// icon + label (label hidden on mobile via CSS)
	$a.append($('<span>', { class: 'btt-icon', text: '↑', 'aria-hidden': 'true' }));		$a.append($('<span>', { class: 'btt-icon', text: '↑', 'aria-hidden': 'true' }));
	$a.append($('<span>', { class: 'btt-label', text: 'Back to Top' }));		$a.append($('<span>', { class: 'btt-label', text: 'Back To Top' }));

	$(document.body).append($a);		$(document.body).append($a);

Bonez565 at 12:48, 5 January 2026

2026-01-05T12:48:36Z

← Older revision		Revision as of 12:48, 5 January 2026
Line 29:		Line 29:
	// Smooth scroll when possible; otherwise browser jumps via #top		// Smooth scroll when possible; otherwise browser jumps via #top
	$a.on('click', function (e) {		$a.on('click', function (e) {
	~~// Smooth scroll when possible; otherwise allow #top jump~~
	try {		try {
	e.preventDefault();		e.preventDefault();

			// Remove focus so :focus can't keep it visible
			this.blur();

	window.scrollTo({ top: 0, behavior: 'smooth' });		window.scrollTo({ top: 0, behavior: 'smooth' });

	~~// Force visibility update after the scroll completes.~~
	~~// Smooth scrolling doesn't always trigger a final scroll event consistently across browsers.~~
	window.setTimeout(setVisible, 250);		window.setTimeout(setVisible, 250);
	window.setTimeout(setVisible, 600);		window.setTimeout(setVisible, 600);

Bonez565 at 12:45, 5 January 2026

2026-01-05T12:45:28Z

← Older revision		Revision as of 12:45, 5 January 2026
Line 28:		Line 28:

	// Smooth scroll when possible; otherwise browser jumps via #top		// Smooth scroll when possible; otherwise browser jumps via #top
	$a.on('click', function (e) {		$a.on('click', function (e) {
	// ~~If the browser supports smooth scrolling, prevent default anchor~~ jump		// Smooth scroll when possible; otherwise allow #top jump
	~~// and do a smooth scroll instead.~~		try {
	try {		e.preventDefault();
	e.preventDefault();		window.scrollTo({ top: 0, behavior: 'smooth' });
	window.scrollTo({ top: 0, behavior: 'smooth' });
	// ~~Update URL hash only if you want it; most wikis prefer not to~~.		// Force visibility update after the scroll completes.
	// ~~history~~.~~replaceState~~(~~null~~, ~~document~~.~~title~~, ~~window.location.pathname + window.location.search~~);		// Smooth scrolling doesn't always trigger a final scroll event consistently across browsers.
	} catch (err) {		window.setTimeout(setVisible, 250);
	// Fall back to anchor behavior		window.setTimeout(setVisible, 600);
	}		} catch (err) {
	});		// Fall back to anchor behavior
			}
			});

	$(window).on('scroll resize', setVisible);		$(window).on('scroll resize', setVisible);

Bonez565: Created page with "/* global mw, $ */ (function () { 'use strict'; var BTN_ID = 'gadget-backtotop'; function buildButton() { if (document.getElementById(BTN_ID)) return; // Anchor provides #top fallback even if JS scroll fails var $a = $('', { id: BTN_ID, href: '#top', title: 'Back to top', 'aria-label': 'Back to top' }); // icon + label (label hidden on mobile via CSS) $a.append($('', { class: 'btt-icon', text: '↑', 'ari..."

2026-01-05T12:33:49Z

Created page with "global mw, $: (function () { 'use strict'; var BTN_ID = 'gadget-backtotop'; function buildButton() { if (document.getElementById(BTN_ID)) return; // Anchor provides #top fallback even if JS scroll fails var $a = $('<a>', { id: BTN_ID, href: '#top', title: 'Back to top', 'aria-label': 'Back to top' }); // icon + label (label hidden on mobile via CSS) $a.append($('<span>', { class: 'btt-icon', text: '↑', 'ari..."

New page

/* global mw, $ */
(function () {
'use strict';

var BTN_ID = 'gadget-backtotop';

function buildButton() {
if (document.getElementById(BTN_ID)) return;

// Anchor provides #top fallback even if JS scroll fails
var $a = $('<a>', {
id: BTN_ID,
href: '#top',
title: 'Back to top',
'aria-label': 'Back to top'
});

// icon + label (label hidden on mobile via CSS)
$a.append($('<span>', { class: 'btt-icon', text: '↑', 'aria-hidden': 'true' }));
$a.append($('<span>', { class: 'btt-label', text: 'Back to Top' }));

$(document.body).append($a);

function setVisible() {
var y = window.pageYOffset || document.documentElement.scrollTop || 0;
$a.toggleClass('is-visible', y > 400);
}

// Smooth scroll when possible; otherwise browser jumps via #top
$a.on('click', function (e) {
// If the browser supports smooth scrolling, prevent default anchor jump
// and do a smooth scroll instead.
try {
e.preventDefault();
window.scrollTo({ top: 0, behavior: 'smooth' });
// Update URL hash only if you want it; most wikis prefer not to.
// history.replaceState(null, document.title, window.location.pathname + window.location.search);
} catch (err) {
// Fall back to anchor behavior
}
});

$(window).on('scroll resize', setVisible);
setVisible();
}

// Ensure it appears even when content is swapped/re-rendered
mw.hook('wikipage.content').add(function () {
buildButton();
});
})();