Tengo un cliente con una página HTML con un par de divs de desplazamiento con contenido de texto. Está usando un diseño basado en imágenes, por lo que las barras de desplazamiento predeterminadas no se adaptan en absoluto. Le gustaría usar un estilo diferente, pero que yo sepa que eso no es posible.¿Cuál es el problema con CSS y barras de desplazamiento?
¿Qué opinas?
Hay una respuesta a esta jQuery -
hay algunas nice examples de los efectos que puede lograr
Es posible.
body {
scrollbar-face-color: #ffffff;
scrollbar-highlight-color: #000000;
scrollbar-shadow-color: #ffffff;
scrollbar-3dlight-color: #ffffff;
scrollbar-arrow-color: #000000;
scrollbar-track-color: #808080;
scrollbar-darkshadow-color: #000000;
}
Nota :: Puede que no funcione si ha especificado un Doctype XHTML !!
Funciona bien en XHTML. El truco es que cuando utilizas un DOCTYPE en modo estándar (que deberías ser, ya sea que uses HTML o XHTML), el elemento IE en el que las barras de desplazamiento principales de la ventana gráfica están es 'html', no 'cuerpo'. Solo establecer en 'html' está bien de todos modos, ya que estas propiedades heredan. – bobince
Usted puede cambiar los colores con CSS, pero IIRC única v5.5 IE + soportes este CSS ¡Otros navegadores no!
ver aquí para una demo: http://www.iconico.com/CSSScrollbar/
Las nuevas nightlys Safari tienen soporte para esto ... pero diferentes propiedades de CSS IIRC. – alex
Desde el punto de vista de la facilidad de uso, el cambio de barras de desplazamiento es un no-go. El usuario está familiarizado con su sistema operativo y el entorno visual que proporciona. Cambiar esto crea confusión, especialmente entre quienes son nuevos en el uso de computadoras, personas mayores, etc.
La mayoría de los usuarios de hoy en día probablemente reconocerá una barra de desplazamiento siempre que tenga su forma básica, y muchos ni siquiera usarán la barra en sí, pero solo la rueda de desplazamiento del mouse.
Sin embargo, todavía es algo en lo que pensar. Considera a tu audiencia. Y haga lo que haga, asegúrese de que realmente funcione en todas las plataformas/en todos los navegadores si usa una barra de desplazamiento personalizada.
Lo malo del uso de jScrollPane es que no puede usar las teclas de flecha para desplazarse hacia arriba o hacia abajo dentro del área de contenido, lo que degrada un poco la usabilidad (aunque esto podría lograrse utilizando otro complemento de jQuery). – Mun
@Mun, este problema se informa como un error en el rastreador de errores del proyecto. Debido a que este problema es importante para mí, planeo presentar una solución de error dentro de la próxima semana más o menos. –
Esta es la solución que elegí y me gusta cómo se ve/funciona. El cliente también está satisfecho, ¡lo cual es aún más importante! – bloudermilk