Desplazamiento suave “cancelable”

Esta es la situación: su sitio ofrece un botón de “desplazarse hacia arriba” y ha implementado un desplazamiento suave. A medida que la página se desplaza hacia la parte superior, los usuarios ven algo que les llama la atención y quieren detener el desplazamiento, por lo que hacen un pequeño desplazamiento con la rueda del mouse, el trackpad o lo que sea. A eso me refiero con cancelable. Sin ninguna acción adicional, el evento de desplazamiento va al destino. Cancelable significa que puedes detenerlo con un desplazamiento posterior. Encuentro que el comportamiento cancelable es mejor UX , aunque no tengo datos que lo respalden.

Encuentro algunas discrepancias entre los navegadores, así como entre CSS y JavaScript, sobre cómo funciona todo esto.

Desplácese hacia abajo en esta demostración y pruébela:

Esto es lo que experimenté en los navegadores a los que tengo fácil acceso:

	Desplazamiento suave CSS	Desplazamiento suave de JavaScript
cromo	Cancelable (velocidad: lenta)	No cancelable
Firefox	Cancelable (Velocidad: ¡Muy rápida!)	Cancelable (Velocidad: ¡Rápido!)
Safari	Sin desplazamiento suave	Sin desplazamiento suave
Borde	Cancelable (Velocidad: Rápida)	No cancelable
iOS	Sin desplazamiento suave	Sin desplazamiento suave

Si fuera por mí, yo:

• Haga que las acciones de desplazamiento suave activadas a través de CSS o JavaScript sean cancelables.
• Defina “cancelable” porque en realidad no es la palabra correcta. ¿Quizás “interrumpido”? ¿O “controlado”? ¡Bienvenidas las ideas!
• Haga que la velocidad sea controlable o, si no, intente que los navegadores acuerden una velocidad media (que se mantenga constante independientemente de la distancia de desplazamiento).
• Haz que Safari lo tengas. El desplazamiento suave hace que cosas como los carruseles sin JavaScript sean muy prácticas, y eso es genial, particularmente en dispositivos móviles donde iOS Safari se fuerza en los dispositivos Apple.