web_parallax_scene Shortcode

El shortcode web_parallax_scene crea el escenario que responde al puntero para capas de imagen, texto y HTML personalizado con efecto parallax. El renderizador genera un ID de frontend único y limita el movimiento desbordante de las capas al escenario.

Los atributos siguientes coinciden con los controles actuales del Page Builder y con la salida pública. Usa la sintaxis sin procesar solo para contenido revisado que no pueda mantenerse mediante los controles visuales.

Shortcodes secundarios permitidos: web_parallax_layer, web_parallax_layer_text, web_parallax_layer_html.

Uso

[web_parallax_scene]
Content
[/web_parallax_scene]

Atributos

Atributo Predeterminado Valores aceptados Propósito
el_class — Nombres de clases CSS separados por espacios Añade clases al contenedor del escenario.

Contenido incluido

Añade solo los tres tipos de capa admitidos a través del builder. Cada capa secundaria aporta su propia profundidad X e Y; el escenario aporta el comportamiento compartido de entrada relativa, solo al pasar el cursor y eventos de puntero.

Personalizar la hoja de estilos

Ve a Settings → POM Theme → Advanced → Custom CSS → Shortcode CSS assets → Parallax scene para comparar el código fuente actual de parallax-scene.min.css con una versión editable. Al guardar se crea una sustitución minimizada por sitio para el handle web-parallax-scene existente. El shortcode, las capas secundarias, los atributos de profundidad, el ID de escena generado, la carga condicional y el script de interacción web_parallax_scene permanecen sin cambios. Revert to theme CSS elimina la sustitución y restaura el activo actual del tema.

Verificación

Prueba el movimiento desde varias posiciones del puntero y comprueba que las capas de primer plano y de fondo siguen la relación de profundidad prevista. Comprueba la composición estática con uso táctil y solo teclado, donde el movimiento impulsado por el puntero no es esencial para comprender el contenido.

El movimiento respeta las preferencias de movimiento reducido y se pausa al enfocar con el teclado. La capa directa visible más alta establece la altura del escenario, incluso sin JavaScript. Los escenarios anidados poseen sus capas de forma independiente. La visibilidad adaptable está disponible mediante las clases auxiliares web-hide-on-* existentes en el_class; este shortcode no tiene un atributo de visibilidad independiente.

Para la edición por bloques, usa Parallax Scene and Layer.