Supprimer les barres de défilement HTML, mais autoriser le défilement de la roue [dupliquer]
possibilité de dupliquer:
comment désactiver le navigateur ou l'élément scrollbar, mais autoriser le défilement avec des touches de roue ou de flèche?
j'ai pu désactiver les barres de défilement verticales dans une grille en définissant la propriété CSS overflow-y: hidden . Cependant, cette supprimé la possibilité de faire défiler le contenu avec la molette de la souris.
Est-il un moyen de ne pas afficher les barres de défilement, mais toujours en laissant le contenu défiler molette de la souris ou les touches fléchées?
2 réponses
il y a des méthodes Javascript, voir le thread que vous avez dupliqué.
une meilleure solution est de mettre la div cible à débordement:scroll, et l'envelopper dans un deuxième élément qui est 8px plus étroit, qui est débordement:caché.
l'élément cible aura une barre de défilement cachée. La souris fonctionnera, mais la barre de défilement ne s'affichera pas.
<div style='overflow:hidden; width:200px;'>
<div style='overflow:scroll; width:208px'>
My mousewheel scrollable content here....
</div>
</div>
Notez que 8px que la largeur de la barre de défilement est un nombre aléatoire - c'est probablement beaucoup plus, et il pourrait exiger par navigateur CSS.
encore mieux que JS dans mon livre.
vous pouvez utiliser jScrollPane qui vous permet de remplacer les barres de défilement du navigateur par des barres personnalisées:
puisque vous pouvez modeler ces barres personnalisées avec CSS vous pourriez facilement les faire disparaître (essayez quelque chose comme: .jScrollPaneTrack { display: none; } )