Propiedad de comportamiento de desplazamiento CSS
Ejemplo
Agregue un efecto de desplazamiento suave al documento:
html {
scroll-behavior: smooth;
}
Definición y uso
La scroll-behavior
propiedad especifica si animar suavemente la posición de desplazamiento, en lugar de un salto directo, cuando el usuario hace clic en un enlace dentro de un cuadro desplazable.
Valor por defecto: | auto |
---|---|
Heredado: | No |
Animable: | No. Leer sobre animable |
Versión: | Módulo de visualización de CSSOM (borrador de trabajo) |
Sintaxis de JavaScript: | objeto .style.scrollBehavior="suave" |
Compatibilidad con navegador
Los números de la tabla especifican la primera versión del navegador que es totalmente compatible con la propiedad.
Property | |||||
---|---|---|---|---|---|
scroll-behavior | 61.0 | 79.0 | 36.0 | 14.0 | 48.0 |
Sintaxis CSS
scroll-behavior: auto|smooth|initial|inherit;
Valores de propiedad
Value | Description |
---|---|
auto | Allows a straight jump "scroll effect" between elements within the scrolling box. This is default |
smooth | Allows a smooth animated "scroll effect" between elements within the scrolling box. |
initial | Sets this property to its default value. Read about initial |
inherit | Inherits this property from its parent element. Read about inherit |