2009-04-24 6 views
2

De la page Google Results, les exemples que j'ai vus travaillaient uniquement dans IE et un cas dans Opera.Comment modifier les couleurs de la barre de défilement du navigateur à l'aide de CSS?

Est-il possible de faire cela de manière cohérente dans tous les navigateurs?

De même, existe-t-il une différence entre la barre de défilement principale du navigateur (qui apparaît sur toute la page) et la barre de défilement dans une zone de texte contenant la page? Puis-je manipuler seulement ce dernier si ce n'est le premier?

Répondre

3

Vous pouvez créer vos propres barres de défilement dans une page en utilisant une combinaison de CSS et JavaScript. Voir https://stackoverflow.com/questions/780674/scroll-bar-with-images.

Toutefois, le rendu de la barre de défilement en dehors de la page appartient au navigateur.

WebKit recently added the ability to style the default scrollbars, mais cela s'applique uniquement à la page.

EDIT: Il semble que MooScrolla réussi à « remplacer » principale scrollbar en disant qu'il n'y a rien à faire défiler et puis en créant leur propre barre de défilement du navigateur à droite le plus côté de la fenêtre. Intelligent!

Steve

+1

La question que vous avez recherchée a été supprimée ... N'importe quelle raison pourquoi? (http://stackoverflow.com/questions/780674/scroll-bar-with-images) – brandonjp

0

Il n'existe pas de méthode de navigateur croisé.

0

Réponse courte no.

L'apparence du navigateur est malheureusement hors de votre contrôle - vous ne fournissez que le contenu. C'est au navigateur de décider comment il veut faire défiler le contenu.

1

Steve avait une bonne réponse, mais permettez-moi de continuer. Dans IE 5.5-7 (mais je pense qu'ils s'en débarrassent en 8), vous pouvez styler les barres de défilement avec certaines propriétés MS CSS. Je ne le recommanderais pas.

Steve mentionne que la barre de défilement en dehors de la page appartient au navigateur. Tandis que ceci est vrai, vous pourriez simuler en plaçant l'élément de corps à overflow: hidden et en plaçant un énorme récipient dans le HTML avec height: 100%; width: 100%.

Je ne vous recommande pas de toucher les barres de défilement de l'utilisateur. Ils sont une convention bien connue, et ils sont rapidement reconnaissables par l'utilisateur final. Ils savent comment utiliser les barres de défilement de style système d'exploitation par défaut, et non votre tentative rapide de mise en œuvre croisée CSS/JS. Je pense que c'était Steve Krug that said 'Don't make me think!'

Avez-vous déjà vu des sites Flash qui roulaient leurs propres barres de défilement? pouah!

+0

Je suis d'accord qu'il est préférable d'utiliser les barres de défilement du système d'exploitation la plupart du temps. Cependant, lorsqu'il est utilisé avec parcimonie * à l'intérieur de la page, je pense que les barres de défilement personnalisées peuvent être belles (voir le "curseur de produit" en haut de http://www.apple.com/mac/). –

+0

C'est très bien, mais ce n'est pas un contrôle de page critique. S'ils l'avaient utilisé comme une barre de défilement pour leur contenu, alors ce serait plus un problème. – alex

Questions connexes