Repolode
alvarotrigo

alvarotrigo/fullPage.js

Una biblioteca de JavaScript para crear sitios web con desplazamiento a pantalla completa, secciones y diapositivas horizontales.

Estrellas
35,360
Forks
7,061
Issues abiertos
137
Último commit
hace 2 meses

¿Qué es?

fullPage.js crea sitios web de una sola página con desplazamiento a pantalla completa, donde cada sección ocupa el viewport y se puede recorrer con la rueda del mouse, gestos táctiles, el teclado o puntos de navegación. Las secciones pueden contener sliders horizontales; además, la biblioteca admite enlaces de anclaje a secciones y diapositivas específicas, así como un menú vinculado a la sección activa.

Se inicializa con una sola llamada sobre un elemento contenedor y se configura mediante opciones que abarcan la velocidad de desplazamiento, la aceleración, los bucles, la carga diferida de contenido multimedia y la adaptación a un desplazamiento normal cuando el ancho o la altura bajan de un valor establecido. Métodos y callbacks como onLeave y afterLoad permiten a los desarrolladores conectarse a las transiciones. Funciona con JavaScript sin bibliotecas, como plugin de jQuery, y cuenta con wrappers para Vue, React y Angular.

Algunas funciones avanzadas, como los efectos cinematográficos, parallax, de diapositivas y de arrastrar y mover, se distribuyen como extensiones que requieren una clave de licencia. La biblioteca principal está disponible bajo GPL-3.0, con la opción de una licencia comercial.

Funciones clave

  • 01Secciones a pantalla completa que se ajustan al viewport al desplazarse, deslizar o usar el teclado.
  • 02Sliders horizontales dentro de las secciones.
  • 03Enlaces de anclaje a secciones y diapositivas individuales, con compatibilidad con el historial del navegador.
  • 04Menú y puntos de navegación que reflejan la sección activa.
  • 05Carga diferida de imágenes, video y audio, además de reproducción automática y pausa al salir para contenido multimedia incrustado.
  • 06Adaptación al desplazamiento normal cuando el ancho o la altura bajan de un valor establecido.

Casos de uso

  • Crear un sitio de marketing o una página de producto de una sola página con secciones a pantalla completa.
  • Crear páginas narrativas donde el contenido avanza sección por sección.
  • Añadir paneles tipo presentación de diapositivas dentro de una página con desplazamiento.
  • Usarlo en WordPress o en proyectos con frameworks mediante los wrappers para Vue, React o Angular.

Inicio rápido

  1. 1

    Instala fullPage.js mediante npm

    npm install fullpage.js
  2. 2

    Incluye los archivos CSS y JavaScript en tu página HTML

  3. 3

    Inicializa fullPage.js en el elemento contenedor

Antes de usarlo

  • Está sujeto a la licencia GPL-3.0, por lo que el uso propietario requiere una licencia comercial independiente.
  • Para uso comercial en proyectos de código cerrado, debes comprar una licencia al proveedor.

Temas

#javascript#fullscreen#scrolling#slider#single-page#animation#frontend-library#fullpage#jquery#mousewheel

Preguntas frecuentes

¿Qué es fullPage.js?
Una biblioteca de JavaScript para crear sitios web con desplazamiento a pantalla completa, secciones y diapositivas horizontales. fullPage.js crea sitios web de una sola página con desplazamiento a pantalla completa, donde cada sección ocupa el viewport y se puede recorrer con la rueda del mouse, gestos táctiles, el teclado o puntos de navegación. Las secciones pueden contener sliders horizontales; además, la biblioteca admite enlaces de anclaje a secciones y diapositivas específicas, así como un menú vinculado a la sección activa.
¿fullPage.js es gratuito? ¿Qué licencia tiene?
fullPage.js es open source bajo la licencia GPL-3.0. Revisa los términos de la licencia antes de usarlo en productos comerciales.
¿fullPage.js sigue mantenido?
Actualizado en los últimos 6 meses. El último commit de fullPage.js fue el 20 sept 2026.
¿Para qué puedo usar fullPage.js?
Crear un sitio de marketing o una página de producto de una sola página con secciones a pantalla completa. Crear páginas narrativas donde el contenido avanza sección por sección. Añadir paneles tipo presentación de diapositivas dentro de una página con desplazamiento. Usarlo en WordPress o en proyectos con frameworks mediante los wrappers para Vue, React o Angular.
¿Cómo se instala fullPage.js?
Instala fullPage.js mediante npm: npm install fullpage.js Incluye los archivos CSS y JavaScript en tu página HTML Inicializa fullPage.js en el elemento contenedor
¿Dónde consigo fullPage.js?
El código fuente y las instrucciones de instalación están en GitHub: https://github.com/alvarotrigo/fullPage.js

Resumen generado por IA a partir del README del proyecto. Las estadísticas de GitHub se actualizan a diario.

Proyectos relacionados

Slider JavaScript gratuito, pensado primero para pantallas táctiles, para sitios web y apps móviles, con transiciones aceleradas por hardware y sin dependencia de jQuery.

Frontend y UI#carousel#slider#touch
41,9 mil9,6 milTypeScriptMITActualizado hace 8 días