Scroll ajustable con div en html y css con optimizacion webkit

[juand210]

Hola gente

Estoy realizando una web optimizada para ipad usando el Framework jquerymobile.

Es como una ayuda audio visual.

entonces por ejemplo, tengo

ITEM1 ITEM2 ITEM3

navegar entre ellos no tengo problema, pero cuando necesito que uno de ellos lleve varios slider en el que tenga que hacer scroll con touch es cuando empiezo a frikear.

quiero que con el evento toush se deslice de un slider a otro, ya sea para la derecha o para la izquierda.

lo he logrado con el siguiente codigo.

Código:

.slider_general{
	width:100%;
	height:474px;
	margin-top:216px;
	background:#9C0;
	overflow-x:scroll;
	overflow-y:hidden;
	-webkit-overflow-scrolling: touch;
	position:absolute;
}
.slider_1{
	background:#CC0;
	width:1024px;
	height:474px;
	position:absolute;
	margin-left:0px;
}
.slider_2{
	background:#F33;
	width:1024px;
	height:474px;
	position:absolute;
	margin-left:1024px;
}

Código HTML:

<!-- Start slider general -->
   <div class="slider_general">
         <!-- Start slider bloque 1-->
         <div class="slider_1">
             ...contenido
          </div><!-- fin slider bloque 1-->
           
 <!-- Start slider  bloque 2-->
    <div class="slider_2">
     ...contenido
     </div><!-- fin slider bloque 2-->
 </div><!-- fin slider general --> 

PROBLEMA: al tener solo html con css el scroll navega vagamente de derecha a izquierda, siendo imposible cuadrar n pantalla el slider que se necesita visualizar.

Me gustaria tener ideas en javascript, para que cuando yo mueva con el touch el slide calcule donde esta el margen de pantalla y se cuadre automaticamente.

No se como se llamará esa acción o evento, por favor necesito alguna pista,

GRACIAS DE ANTEMANO