MediaWiki:Gadget-GoToTop.js

Want an adless experience? Log in or Create an account.

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 (Command+R on a Mac)
• Google Chrome: press Ctrl+Shift+R (Command+Shift+R on a Mac)
• Internet Explorer: hold Ctrl while clicking Refresh, or press Ctrl+F5
• Konqueror: click Reload or press F5
• Opera: clear the cache in Tools → Preferences

$('body').append('<span id="to-top" style="text-decoration:none;text-shadow: 1px 1px 1px #aaa;"><img src="/wiki/images/thumb/e/e6/Triforce.png/16px-Triforce.png" style="vertical-align: baseline;" border="0" alt="Go to top" /> Go to top</span>');
var $topButton = $('#to-top');
$topButton.css({
    'color': '#000',
    'position': 'fixed',
    'bottom': '-30px',
    'right': '4px',
    'cursor': 'pointer',
    'transition': 'bottom 0.5s',
    '-webkit-transition': 'bottom 0.5s',
    'user-select': 'none',
    '-webkit-user-select': 'none',
    '-moz-user-select': 'none',
    '-ms-user-select': 'none'
}).click(function() {
    $('html, body').animate({
        scrollTop: 0
    }, 'slow');
});
$(window).scroll(function() {
    if ($(window).scrollTop() > 100) {
        $topButton.css('bottom', '4px');
    } else {
        $topButton.css('bottom', '-30px');
    }
});