MediaWiki:Gadget-GoToTop.js: Difference between revisions
Jump to navigation
Jump to search
Want an adless experience? Log in or Create an account.
(Created page) |
(relative url (workaround for broken apache redirect)) |
||
| (3 intermediate revisions by 2 users not shown) | |||
| Line 1: | Line 1: | ||
$( 'body' ).append( '<span id="to-top"> | $('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' ); | var $topButton = $('#to-top'); | ||
$topButton.css({ | |||
$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() { | |||
} ).click( function() { | $('html, body').animate({ | ||
scrollTop: 0 | |||
} ); | }, 'slow'); | ||
}); | |||
$( window ).scroll( function() { | $(window).scroll(function() { | ||
if ($(window).scrollTop() > 100) { | |||
$topButton.css('bottom', '4px'); | |||
} else { | |||
$topButton.css('bottom', '-30px'); | |||
} | |||
} | }); | ||
} ); | |||
Latest revision as of 23:56, April 3, 2017
$('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');
}
});