BackToTopButton додає клавішу до правого кута панелі інструментів, яке повертає читача у верхню частину сторінки при натисканні.
Installation[]
Налаштування[]
Якщо ви хочете налаштувати швидкість прокручування вгору або кількість прокручувань вниз, яку вам потрібно зробити, щоб клавіша з’явилася, і цілий ряд інших варіантів, перед імпортом скрипта (для global.js) або до сторінки Wikia.js вашої спільноти.
Modernization[]
The button has two variants, a modern one and the old one. The old one is shown by default, but if you want to enable the modern behavior you can use:
window.BackToTopModern = true;
Arrow icon[]
If you want to use the old variant of the button but display an arrow instead of a button, you can use:
window.BackToTopArrow = true;
Текст клавіши[]
Текст клавіши автоматично буде відображатися мовою користувача. Однак, якщо ви хочете змінити текст, ви можете зробити це за допомогою такого параметра.
window.BackToTopText = "новий текст";
Швидкість прокручування[]
Щоб налаштувати швидкість прокрутки, додайте оце:
window.BackToTopSpeed = number;
де number — це час прокручування в мілісекундах. Більш високі числа призводять до повільного прокручування, а менші числа призводять до швидшої прокрутки. Значення за замовчуванням дорівнює 600.
Поява клавіши[]
Щоб налаштувати «глибину», яку потрібно досягти, щоб клавіша з’явилася/зникла, додайте оце:
window.BackToTopStart = number;
де number — відстань від початку сторінки в пікселях перед тим, як з’явиться клавіша. Більш високі значення змусять читача прокручувати далі, перш ніж з’явиться клавіша. Значення за замовчуванням — 800.
Формат клавіші[]
Ви також можете форматувати клавіша будь-яким способом за допомогою CSS. Наприклад:
/* Форматування клавіши «Вгору» */
#BackToTopBtn div {
opacity: 0.7;
transition: .5s;
}
#BackToTopBtn div:hover {
opacity: 1;
}
Наведений вище CSS змусить клавішу виглядати як просте посилання.
/* Форматування клавіши «Вгору» */
#backtotop button{
background: none;
background-color: transparent;
color: white;
border: none;
}
#backtotop button:hover {
text-decoration: underline;
}
The above CSS rules will make the button look like a simple link. This works only on the old variant of the button.
Відключення ефекту появи/зникання клавіші[]
Щоб вимкнути ефект зникання, додайте це:
window.BackToTopFade = 0;
Using configuration options with Fandom Developers Wiki scripts
The instructions on this page describe how to use configuration options with a script. Here on the Fandom Developers Wiki, many scripts provide optional configuration settings as a mean to alter or enhance the default behavior of the script. When installing configuration options in your JavaScript file, please note that they need to go above the import statement in order to work — unless the directions say otherwise. In case MediaWiki:ImportJS is used to load the scripts, it will be executed last.
// 1. AjaxRC import statement
importArticles({
type: 'script',
articles: [
'u:dev:MediaWiki:AjaxRC.js'
]
});
// 2. AjaxRC configuration option
window.ajaxRefresh = 30000;
// 1. AjaxRC configuration option
window.ajaxRefresh = 30000;
// 2. AjaxRC import statement
importArticles({
type: 'script',
articles: [
'u:dev:MediaWiki:AjaxRC.js'
]
});
Щоб знову ввімкнути ефект, просто вилучіть цей рядок зі сторінки JS. Ефект зникання для клавіші увімкнено за замовчуванням.
