2012-05-25 14 views
6

había tratado de poner en práctica un split view utilizando el código de ejemplo JQuery mobile Phone gapiPhone JQuery: Cómo implementar una vista dividida en iPad usando jQuery Mobile + brecha de teléfono en iPhone

enindex.html

<head> 
     <link rel="stylesheet" href="inc/jquery.mobile.structure-1.0.1.min.css" /> 
     <link rel="stylesheet" href="inc/jquery.mobile-1.0.1.min.css" /> 
     <link rel="stylesheet" href="inc/resources/css/jquery.toastmessage.css" /> 

     <script type="text/javascript" src="inc/jquery-1.7.1.min.js"></script> 
     <script type="text/javascript" src="inc/jquery.mobile-1.0.1.min.js"></script> 

     <script type="text/javascript" src="inc/phonegap-1.2.0.js"></script> 
    </head> 

    <body> 

     <div data-role="page" data-theme="c"> 
      <div data-role="header"> 
       Mpbile Split View 
      </div> 

      <div data-role="content"> 

       <!--- Left side view------> 
       <div class="left-content"> 
        <h3>lef hand content</h3> 
        <ul data-role="listview"> 
         <li>One</li> 
         <li>One</li> 
         <li>One</li> 
         <li>One</li> 
        </ul> 
       </div> 

       <!--- Right side view------> 
       <div class="right-content"> 
        <h3>Right hand content</h3> 
        <ul data-role="listview"> 
         <li>Two</li> 
         <li>Two</li> 
         <li>Two</li> 
         <li>Two</li> 
        </ul> 
       </div> 
      </div> 
     </div> 


    </body> 
</html> 

Pero muestra tanto en la vista en la misma página, uno por uno arriba a abajo como se muestra a continuación

enter image description here

Necesito dos tablas como split viewuna en el lado izquierdo (root view) y otro en el lado derecho (details view)

¿cómo es posible usar jQuery? gracias de antemano

+0

¿Qué hay en el CSS? – Grumpy

Respuesta

1

Puede usar http://jeromeetienne.github.com/jquery-mobile-960/ y dividirlo con esas cuadrículas.

Si conoce 960.gs o cualquier otro marco de cuadrícula CSS, será muy fácil para usted. Hay una demo de uso en el sitio mencionado.

+0

Este es un proyecto de GitHub que no se ha actualizado en 3 años. La documentación parece ser muy buena y la página principal sirve como un ejemplo de cómo funciona. Por otro lado, parece un poco excesivo si lo único que quieres es dividir la pantalla del iPod por la mitad. Finalmente, hay un comentario de cinco meses de antigüedad, aún sin respuesta, que pregunta si se actualizará para admitir las últimas versiones de jQuery. Yo digo "¡No!" – samwyse

1

Pruebe usar mi multiview plugin.

Permite paneles 1/2/3 uno al lado del otro más paneles popover en Jquery Mobile. No lo he intentado con PhoneGap (acaba de terminar para JQM 1.1), así que si lo intentas, avísame si funciona (supongo).

Utilice la versión 1.1 y la versión 1.1.multiview de JQM, que necesita algunos ajustes para funcionar.

Actualmente estoy haciendo el nuevo sitio de muestra y README. Debería estar levantado en unos días.

+0

impresionante - funciona como un encanto. gracias por compartir. – dirkk0

+0

Este es un proyecto de GitHub que no se ha actualizado en 2 años, todavía no tiene un archivo README ni ninguna otra documentación que pueda ver, y todavía no hay punteros a un sitio de muestra. Yo digo "¡No!" – samwyse

+0

Si puede permitirse el tiempo para proporcionar alguno de los anteriores, siéntase libre de bifurcar, actualizar y mantener, porque actualmente no puedo ... – frequent

Cuestiones relacionadas