0
171
VistasDesplácese hasta la identificación que no funciona en el modo de pantalla completa
Creé un script para habilitar/deshabilitar la pantalla completa en la página web (React JS). En la página web, al hacer clic en el botón, la página web se desplaza hacia arriba. Desplazarse hacia arriba funciona bien en la página web normal, pero cuando la pantalla completa está habilitada, el desplazamiento no funciona. Además, utilicé el paquete scrollToElement React JS para desplazarme, pero esto tampoco funciona.
importar React desde 'react'; importar {FullScreen, useFullScreenHandle}
export const A = () => { /* Click handler to enable the scroll to root*/ handleClick = () => { window.scrollTo( 0, 0) } return (<FullScreen handle={handle}> <button onclick={ () => handleClick() }>Scroll To Top</button> </FullScreen>) } In Fullscreen scroll is not working.1 Respuestas
Responde la pregunta0
La biblioteca de terceros utilizada react-full-screen tiene una implementación en la que, cuando el componente FullScreen pasa a pantalla completa, establece el div contenedor en height: 100% sin overflow: auto/scroll .
Así, el elemento ocupa la pantalla completa y el contenido se desborda sin scroll. Por lo tanto, debemos configurar el overflow correctamente y configurar la función de desplazamiento en el div contenedor en lugar de en body .
Este div es el elemento contenedor cuando el paquete activa la pantalla completa.
Consulte la implementaciónaquí . Abra la vista previa en una nueva pestaña para que la pantalla completa funcione correctamente.