Temas de CSS - Cambiando el diseño de las barras de scroll con CSS

Imágen de perfil

internetCambiando el diseño de las barras de scroll con CSSgráfica de visualizaciones


CSS

Publicado el 22 de Abril del 2019 por Administrador
1.226 visualizaciones desde el 22 de Abril del 2019
Una de las recomendaciones fundamentales para una buena usabilidad es no modificar en exceso el diseño de los elementos que forman parte de la interfaz de usuario del sistema operativo, tales como botones, elementos select, las barras de scroll, etc. Hacerlo complica el uso de tu sitio o aplicación web porque el usuario tiene que aprender a reconocerlos.

No obstante, como toda norma tiene sus excepciones, a veces puede ser necesario modificar estos elementos en algunos diseños muy especiales. Firefox 64, publicado en diciembre de 2018, añade entre sus nuevas funcionalidades la posibilidad de cambiar el diseño de las barras de scroll.

En concreto, lo hace a través del estándar CSS Scrollbars Module Level 1, que todavía se encuentra en fase de borrador y no es un estándar oficial. Los tres escenarios para los que se ha pensado este estándar son:

1.- Cambiar el color de las barras de scroll para adaptarlas al diseño de la aplicación o sitio web.
2.- Mostrar barras de scroll más finas de lo normal cuando un elemento lo requiera.
3.- Diseñar barras de scroll totalmente personalizadas si el diseño así lo requiere.

Para ello se han definido dos nuevas propiedades CSS (scrollbar-color y scrollbar-width) que se pueden aplicar a la página entera y también a cualquier elemento que soporte la propiedad overflow de CSS.

Forma parte de Uniwebsidad
 

Si alguno de los archivos de descarga no funciona, comentanos aquí el error.




Comentarios... (0)


No hay comentarios
 

Comentar

Nombre
Correo (no se visualiza en la web)
Valoración
Comentarios...
CerrarCerrar
CerrarCerrar
Cerrar

Tienes que ser un usuario registrado para poder insertar imágenes, archivos y/o videos.

Puedes registrarte o validarte desde aquí.

Codigo
Negrita
Subrayado
Tachado
Cursiva
Insertar enlace
Imagen externa
Emoticon
Tabular
Centrar
Titulo
Linea
Disminuir
Aumentar
Vista preliminar
sonreir
dientes
lengua
guiño
enfadado
confundido
llorar
avergonzado
sorprendido
triste
sol
estrella
jarra
camara
taza de cafe
email
beso
bombilla
amor
mal
bien
Es necesario revisar y aceptar las políticas de privacidad

http://lwp-l.com/t9975