Añadiendo una superposición a los bloques de código para prevenir el desplazamiento hasta que el usuario haga clic en ellos

Hola :wave:

Los bloques de código pueden ser muy largos… Por ejemplo, cuando contienen un registro de reconstrucción completo u otro texto largo… No es muy fácil desplazarse por la sección de bloques de código en una publicación o desplazarse hasta el final del bloque de código, especialmente en pantallas de tamaño reducido. La forma más fácil es desplazarse un poco antes del bloque de código o encontrar los 10px en los laterales.

Sería una buena opción añadir una superposición a los bloques de código enormes que impida el desplazamiento hasta que un usuario interactúe. Cuando el usuario haga clic en ella, la superposición desaparecerá y se activará el desplazamiento.

Gracias :slightly_smiling_face:

1 me gusta

¿Quizás intentar en un componente temático? ¿Puedes ver cómo se siente?

2 Me gusta

Sí, lo pensé. Es totalmente factible con un componente. Lo intentaré. :slightly_smiling_face:

1 me gusta

Hola :waving_hand:

Esta es la primera versión, quise decir algo como esto, pero estoy atascado definiendo la altura del elemento. :confused: La superposición solo se mostraría en un bloque de código desplazable. Lo intenté con element.scrollHeight > n etc… pero parece que siempre obtiene una altura de 0. Tengo que encontrar otra forma de definir si el bloque de código es desplazable…

1 me gusta

Hola :wave:

De vuelta aquí después de mucho tiempo… Lo había olvidado por completo. Ahora he hecho uno que funciona. :smile:

1 me gusta