BackToTopButton agrega un botón en la esquina derecha de la página (en la versión moderna) o en la barra de herramientas (en la versión anterior) que lo lleva de regreso a la parte superior de la página cuando se presiona.
Instalación[]
Personalización[]
Si desea ajustar la velocidad del desplazamiento hacia arriba o la cantidad de desplazamiento hacia abajo que tiene que hacer para que aparezca el botón y un montón de otras opciones, agregue las siguientes líneas antes de importar el script (para global.js) o en la página MediaWiki:Common.js de su comunidad.
Modernizaión[]
El botón tiene dos variantes, uno moderno y otro antiguo. El antiguo se muestra de forma predeterminada, pero si desea habilitar el comportamiento moderno, puede usar:
window.BackToTopModern = true;
Icono de flecha[]
Si desea usar la variante anterior del botón, pero muestra una flecha en lugar de un botón, puede usar:
window.BackToTopArrow = true;
Texto del botón[]
El texto del botón se mostrará automáticamente en el idioma del usuario. Sin embargo, si desea cambiar el texto, puede hacerlo con lo siguiente.
window.BackToTopText = "new text";
Velocidad de desplazamiento[]
Para ajustar la velocidad de desplazamiento agregue esto:
window.BackToTopSpeed = number;
Donde number es el tiempo de desplazamiento, en milisegundos. Los números más altos dan como resultado un desplazamiento más lento y los números más pequeños dan como resultado un desplazamiento más rápido. El valor predeterminado es 600.
Apariencia del botón[]
Para ajustar la "profundidad" tienes que alcanzar el botón para que aparezca/desaparezca agrega esto:
window.BackToTopStart = number;
Donde number es la distancia hacia abajo en la página, en píxeles, antes de que aparezca el botón. Los números más altos harán que se desplace más hacia abajo antes de que aparezca el botón. El valor predeterminado es 800.
Formato de botón[]
También puede formatear el botón de la forma que desee con CSS. Por ejemplo:
/* Back-to-top button format */
#BackToTopBtn div {
opacity: 0.7;
transition: .5s;
}
#BackToTopBtn div:hover {
opacity: 1;
}
Las reglas de CSS anteriores harán que el botón sea semitransparente hasta que se mueva. Esto solo funciona en la variante moderna del botón.
/* Back-to-top button format */
#backtotop button{
background: none;
background-color: transparent;
color: white;
border: none;
}
#backtotop button:hover {
text-decoration: underline;
}
Las reglas CSS anteriores harán que el botón se vea como un enlace simple. Esto solo funciona en la variante anterior del botón.
Desactivar el efecto de fundido de entrada/salida del botón ===[]
Para deshabilitar el efecto de desvanecimiento, agregue esto:
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'
]
});
Para volver a habilitar el efecto, simplemente elimine esta línea de su página JS. El efecto de aparición/desaparición gradual del botón está habilitado de forma predeterminada.