Fandom Developers Wiki
Advertisement

BackToTopButton fügt eine Schaltfläche in der rechten Ecke der Seite (in der modernen Version) oder in der Symbolleiste (in der alten Version) hinzu, die beim Drücken zum Anfang der Seite zurückbringt.

Installation[]

Anpassungen[]

Wenn die Geschwindigkeit des Scrollens nach oben oder die Menge des Scrollens verändert werden soll, damit die Schaltfläche erscheint, und eine Reihe anderer Optionen einstellen möchten, füge folgende Zeilen vor dem Import des Skripts (für global.js) oder der MediaWiki:Common.js-Seite der Gemeinschaft hinzu.

Modernisierung[]

Die Schaltfläche hat zwei Varianten, eine moderne und die alte. Die alte wird standardmäßig angezeigt, aber das moderne kann wie folgt aktiviert werden:

window.BackToTopModern = true;

Pfeilsymbol[]

Wenn die alte Variante der Schaltfläche verwendet werden soll, aber einen Pfeil anstelle einer Schaltfläche angezeigt werden soll, kann folgendes verwendet werden:

window.BackToTopArrow = true;

Schaltflächentext[]

Der Text der Schaltfläche wird automatisch in der Sprache des Benutzers angezeigt. Wenn der Text jedoch geändert werden soll, kann dies wie folgt getan werden:

window.BackToTopText = "Neuer Text";

Bildlaufgeschwindigkeit[]

Zum Einstellen der Bildlaufgeschwindigkeit folgendes hinzufügen:

window.BackToTopSpeed = number;

Dabei ist number die Bildlaufzeit in Millisekunden. Höhere Zahlen bedeuten langsameres Scrollen und kleinere Zahlen bedeuten schnelleres Scrollen. Der Standardwert ist 600.

Erscheinungsbild der Schaltfläche[]

Über die Variable Start kann bestimmt werden, wie weit man herunterscrollen muss, damit der Button erscheint:

window.BackToTopStart = number;

Dabei ist number der Abstand in Pixeln, den die Seite zurücklegen muss, bevor die Schaltfläche erscheint. Bei höheren Zahlen muss weiter nach unten gescrollt werden, bevor die Schaltfläche erscheint. Der Standardwert ist 800.

Schaltflächen-Formatierung[]

Das Aussehen der Schaltfläche kann frei mit CSS gestaltet werden. Beispiel:

/* Zurück-nach-oben Schaltflächen-Formatierung */
#BackToTopBtn div {
    opacity: 0.7;
    transition: .5s;
}
#BackToTopBtn div:hover {
    opacity: 1;
}

Die oberen CSS-Regeln lassen die Schaltfläche halbtransparent vor dem darauf zeigen aussehen. Das funktioniert nur bei der modernen Variante der Schaltfläche.

/* Zurück-nach-oben Schaltflächen-Formatierung */
#backtotop button{
    background: none;
    background-color: transparent;
    color: white;
    border: none;
}
#backtotop button:hover {
    text-decoration: underline;
}

Die oberen CSS-Regeln lassen die Schaltfläche wie einen Link aussehen.

Verblassen der Schaltfläche abschalten[]

Zum Entfernen des verblassen Effektes:

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.

Configuration options load too late, don't work
// 1. AjaxRC import statement
importArticles({
    type: 'script',
    articles: [
        'u:dev:MediaWiki:AjaxRC.js'
    ]
});

// 2. AjaxRC configuration option
window.ajaxRefresh = 30000;
Proper placement of configuration options
// 1. AjaxRC configuration option
window.ajaxRefresh = 30000;

// 2. AjaxRC import statement
importArticles({
    type: 'script',
    articles: [
        'u:dev:MediaWiki:AjaxRC.js'
    ]
});

Um den Effekt zu reaktivieren, muss nur diese Zeile wieder aus dem JS entfernt werden. Der verblassen Effekt ist standardmäßig aktiviert.

Advertisement