2010-07-20 24 views
36

Duplicar posibles:
How to disable browser or element scrollbar, but allow scrolling with wheel or arrow keys?ocultar la barra de desplazamiento, mientras que todavía es capaz de desplazarse con el ratón/teclado

me gustaría saber si es posible ocultar la barra de desplazamiento, mientras se desplaza todavía es permitido con mouse/teclado.

He intentado usar CSS: desbordamiento: oculto; El efecto es, la barra de desplazamiento está deshabilitada Y el desplazamiento está deshabilitado.

Respuesta

44

Para referencia futura también hay una solución sin jQuery - sólo tiene el estilo envoltorio div contener overflow:hidden y utilizar este JavaScript dos forro:

// get the width of the textarea minus scrollbar 
var textareaWidth = document.getElementById("textarea").scrollWidth; 

// width of our wrapper equals width of the inner part of the textarea 
document.getElementById("wrapper").style.width = textareaWidth + "px"; 

Ver demo o completa HOWTO.

Actualización: puede utilizar el mismo principio para crear div desplazable sin barra de desplazamiento: demo.

+5

Bien, pero ¿qué hay del navegador y la compatibilidad con dispositivos móviles para esto? –

+1

@cocoacoder siempre podrías INTENTARLO en diferentes navegadores y dispositivos móviles si te estás preguntando ... Probé en iOS y IE9 y funciona bien. No hay nada demasiado raro en este enfoque, por lo que debería ser bastante compatible. Siempre que la plataforma admita la propiedad scrollWidth, funcionará correctamente. – Gavin

+0

parece que todos los navegadores de todo el mundo lo admiten: http://www.w3schools.com/jsref/prop_element_scrollwidth.asp –

0

No de forma nativa, pero supongo que podría implementar su propio mecanismo de desplazamiento mediante el uso de Javascript para capturar ciertas pulsaciones de teclas y reubicar el elemento contenedor en consecuencia con CSS. Sin embargo, va a ser feo!

7

Hay un complemento jQuery llamado Scrollable que hace lo que quiere.

Cuestiones relacionadas