Foro Foros Diseño Web Barras de desplazamiento Respuesta a: Barras de desplazamiento

#1273
ceslava
Superadministrador

    Hola lucas,

    Cambiar la apariencia de las barras de desplazamiento con CSS no es posible en navegadores basados en  Webkit, KHTML, o Gecko.

    Sólo hay propiedades CSS para Internet Explorer y las barras de desplazamiento. Aquí tienes un ejemplo que puedes probar en varios navegadores:

    http://lineadecodigo.com/wp-content/uploads/2007/11/color-barras-scroll.html

    En resumen, no es recomendable, no es un estándar y no es cross-browser.

    Las propiedades CSS son:

    • scrollbar-3dlight-color, color del borde que hace

      el efecto 3D en la barra de scroll.

    • scrollbar-arrow-color, color de las flechas.
    • scrollbar-base-color, es el color genérico a

      utilizar por la barra de scroll. Podríamos utilizar únicamente este para

      dar color a la barra.

    • scrollbar-darkshadow-color, sombra de la barra de

      progreso.

    • scrollbar-face-color, el color de lo que es

      realmente la barra de progreso. Es decir, del bloque que se mueve por la

      barra.

    • scrollbar-highlight-color, el color del fondo de

      la barra.

    • scrollbar-shadow-color, son los dos botones sobre

      los que podemos pulsar para desplazar la barra.

    • scrollbar-track-color, es el color de fondo de la

      barra de scroll.

    Si aún así quieres cambiar su aspecto en todos los navegadores deberás utilizar alguna solución javascript como esta:

    http://www.hesido.com/web.php?page=customscrollbar

    Al parecer es compatible también con el iPhone.

    Saludos