2010-08-16 9 views
35

¡He intentado tantas cosas diferentes y sigo buscando pero no encuentro nada!¿Alguna forma de hacer div scroll en el ipad?

¿Ayuda a alguien?

+0

No me he equivocado con estas cosas, pero si está desarrollando para dispositivos móviles usando jquery, debería considerar usar esto: http://jquerymobile.com/ –

+0

Quiere desplazarse a través de la interfaz de usuario, o programáticamente? –

+0

+1 para una gran pregunta! Solo estaba investigando lo mismo. –

Respuesta

12

ver si esto ayuda, el tipo dice el div debe tener un tamaño fijo: http://uxebu.com/blog/2010/04/27/touchscroll-a-scrolling-layer-for-webkit-mobile/

Si eso no es lo que está buscando, es posible que también echa un vistazo a jQTouch y cosas como esta extensión jqt.scroll: (lo siento, no puedo publicar 1 enlace al parecer, busque jqt.scroll.js en este sitio: code.google.com/p/jqextensions/)

+0

No lo he intentado aún, encontré otro que funciona muy bien ... pero no para desplazarse dentro de un div. Estoy a punto de probar que el enlace que me enviaste suena perfecto para lo que quiero hacer. le dejaré saber cómo va eso – cat

+0

'jqt.scroll.js' parece basarse en el código iScroll de Cubiq.org (ver a continuación). –

+0

Touchscroll funcionó bien para mí, descrito en ese blog uxebu.com –

2

que he tenido mucha suerte con esto en todos los navegadores y plataformas, incluido iPad: http://www.kelvinluck.com/assets/jquery/jScrollPane/jScrollPane.html

Pero, en realidad es simplemente la fantasía-ing el efecto básico overflow: auto en un elemento

+6

En el iPad, esto no parece mostrar las barras de desplazamiento, y todavía tiene que usar 2 dedos. ¿Hay alguna manera de mostrar las barras de desplazamiento y tener 1 dedo de desplazamiento? – Elie

27

use DOS dedos en el div !!! Eso es todo

+2

Funciona, pero la mayoría de los usuarios nunca lo resolverán. Necesito hacerles saber de alguna manera ... –

+0

Estoy de acuerdo .. Yo nunca trataría de desplazarme con dos dedos. – Damon

30

Css Solución

-webkit-overflow-scrolling: touch; 
+0

Impresionante, funciona como magia en mi iPad2 –

+1

Mientras esto funciona, hay un problema con los elementos que se posicionan absolutamente. Por ejemplo, tengo una punta de herramienta dentro de mi contenedor junto con algunos elementos de formulario. La información sobre herramientas se esconde debajo de los elementos del formulario si agrega -webkit-overflow-scrolling: touch. Además, es posible que observe que ciertos elementos pueden volverse invisibles si se ubican relativamente dentro de su contenedor. Puede evitar esto configurando una propiedad de transformación 3d, pero aún tendrá problemas con el posicionamiento absoluto. –

+0

¡Ahorro de vida! Muchas gracias. – dotty

0

tuve tema muy inusual para iPhone 6 con el desplazamiento de contenedores, que los padres tiene max-height: 100%; Este estilo de alguna manera estaba deshabilitando el desplazamiento. Cuando cambio el estilo del contenedor primario a alto: 100% funciona, pero el objetivo era preservar la altura máxima. Así que la solución fue añadir

-webkit-transform: translate3d(0, 0, 0)

la esperanza que esto sea útil, he perdido toda la tarde luchando con él.

Cuestiones relacionadas