Si utilizas ElementorKit para tu sitio web y te encuentras con un problema en el que la superposición del menú móvil impide a los usuarios cerrar el menú, no eres el único. Se trata de un error conocido por el que el menú permanece visible aunque los usuarios puedan desplazarse por la página. El botón de cierre "X" deja de responder, lo que provoca una experiencia de usuario frustrante. Afortunadamente, existe una solución sencilla para este problema.
Entender el problema
El problema estriba en que valores z-index en la superposición del menú móvil y en el contenedor del menú. La superposición cubre el botón de cierre, haciendo imposible que los usuarios interactúen con él. Como resultado, el menú permanece abierto aunque los usuarios intenten cerrarlo o hacer clic fuera del área del menú.
Solución paso a paso
A continuación se explica cómo resolver el problema ajustando el valores z-index en Elementor:
1. Abrir la cabecera en Elementor
- Navegue hasta su WordPress salpicadero.
- Ir a Plantillas > Plantillas guardadas y localice su cabecera.
- Haga clic en Editar con Elementor para abrir la plantilla de cabecera en Elementor editor.
2. Ajustar el índice z de la superposición
- Seleccione contenedor que contiene su menú móvil superpuesto.
- En virtud de la Avanzado desplácese hasta la pestaña CSS personalizado sección.
- Añade el siguiente código CSS:
z-index: auto !important;
Esto garantiza que el índice z de la superposición no anule el botón de cierre ni interfiera con las interacciones del usuario.
3. Establezca un índice z alto para el menú
- Ahora, seleccione el contenedor de menú móvil (el elemento que contiene los elementos de menú y el botón de cierre).
- En virtud de la Avanzado localice la pestaña z-index campo.
- Ajuste el índice z a 5000 específicamente para la vista móvil. Para ello, cambie a la vista modo sensible en Elementor y seleccionando el vista móvil.
- Vista de escritorio: Deje el z-index como está.
- Vista móvil: Establecer z-index en 5000.
4. Guardar y probar
- Guarde los cambios haciendo clic en Actualización.
- Pruebe su menú móvil para asegurarse de que la superposición ya no bloquea el botón de cierre, y el menú se cierra como se espera al hacer clic fuera o utilizando el botón "X".
Por qué funciona
El índice z predeterminado de la superposición suele ser demasiado alto, lo que hace que se sitúe por encima de elementos interactivos como el botón de cierre. Si ajusta el índice z de la superposición a auto y aumentando el índice z del menú a 5000se da prioridad al menú y a sus elementos interactivos sobre la superposición.
Reflexiones finales
Este conflicto de z-index en ElementorKit es un error común, pero con la solución anterior, puede solucionar rápidamente el problema y restaurar el comportamiento esperado de su menú móvil. Mantener el menú móvil funcional es esencial para la experiencia del usuario, especialmente porque los usuarios móviles representan una parte significativa del tráfico web.
Si el problema persiste a pesar de estos cambios, póngase en contacto con el equipo de soporte de ElementorKit para obtener más ayuda.