examples - jquery mobile themes
¿Diferencia entre jQuery y jQuery Mobile? (4)
No tiene suficientes puntos para comentar arriba, así que agregue al hilo para responder la segunda pregunta de Andy sobre las dependencias.
Creo que lo que estás buscando está aquí: jQuery Mobile Demo
<!DOCTYPE html>
<html>
<head>
<title>Page Title</title>
<meta name="viewport" content="width=device-width, initial-scale=1">
<link rel="stylesheet" href="http://code.jquery.com/mobile/[version]/jquery.mobile- [version].min.css" />
<script src="http://code.jquery.com/jquery-[version].min.js"></script>
<script src="http://code.jquery.com/mobile/[version]/jquery.mobile-[version].min.js"></script>
</head>
<body>
...content goes here...
</body>
</html>
Soy nuevo en el desarrollo web móvil, y acabo de hacer una aplicación móvil con PhoneGap, empleando el uso frecuente de jQuery.
Pero naturalmente hubo un par de fallas relacionadas con la forma en que formateé las cosas y la forma en que aparecieron en las pantallas de los dispositivos móviles con las que estaba probando, y al tratar de resolverlas tropecé con muchas sugerencias para facilitar las cosas a mí mismo al usar jQuery móvil.
Ahora esto me confunde ... jQuery no tenía rol en el formateo. Ese fue solo el nivel de conocimiento de principiante de CSS móvil que causó los problemas.
Entonces, ¿qué hace exactamente jQuery móvil, y cómo es diferente de jQuery ordinario? Si ya sé jQuery, ¿qué será nuevo para mí?
jQuery es un marco de JavaScript manipulando / atravesando y AJAX. Se abstrae una gran cantidad de la complejidad entre los diferentes navegadores automáticamente. Hay innumerables complementos jQuery que simplifican muchas tareas.
jQuery Mobile es un marco de interfaz de usuario orientado a aplicaciones móviles que se basa en jQuery. Tiene componentes de tematización y UI.
En total, son gratuitos. No es necesario que use jQuery Mobile para usar jQuery. Pero para usar jQuery Mobile, debe usar jQuery.
Qué es el móvil jQuery
JQM (jQuery mobile) es un sistema de interfaz de usuario para teléfonos móviles que se basa en jQuery. jQuery es requerido para que JQM funcione. A diferencia de otros marcos de teléfonos móviles similares, los objetivos de JQM son compatibles con todas las principales plataformas móviles, de tabletas, de lectura electrónica y de escritorio, y no solo con navegadores de webkit móviles. Una de las características más notables del framework es el sistema de navegación Ajax que usa transiciones animadas de páginas (muy buenas).
Lo que puede ser nuevo para ti
Una cosa sobre JQM que arroja una bola curva a los nuevos usuarios es la navegación ajax. Procedente de jquery, probablemente esté acostumbrado a incluir su javascript en cada página y luego usar dom ready ( $(function(){ ... } or $(document).ready(function(){ .... } ) para disparar todas sus actividades de javascript divertidas. Pero debido a que JQM usa la navegación ajax, el sistema colocará otras páginas en el mismo dom que la primera página y no cargará las secuencias de comandos incluidas en <head> . Cuando se carga la página siguiente a través de ajax, lo hará fíjate que tus cosas dentro de $(function(){ ...} no funcionarán en la segunda página. La solución a esto es vinculante para el evento pageinit. Estos ejemplos te ayudarán al principio de tu viaje:
$(document).on(''pageinit'', function(){ // this fires for each new page
});
Para orientar una página determinada, agregue la identificación de la página:
$(document).on(''pageinit'',''#page2'', function(){ // this fires for #page2 only
});
Comprender los nuevos eventos de página te ayudará mucho cuando comiences con JQM. http://jquerymobile.com/demos/1.1.0/docs/api/events.html Buena suerte!
jQuery está diseñado exclusivamente para simplificar y estandarizar scripts en navegadores. Se centra en las cosas de bajo nivel: crear elementos, manipular el DOM, gestionar atributos, realizar solicitudes HTTP, etc.
jQueryUI es un conjunto de componentes y características de la interfaz de usuario construido sobre jQuery (es decir, necesita jQuery para funcionar): botones, cuadros de diálogo, controles deslizantes, pestañas, animaciones más avanzadas, funcionalidad de arrastrar / soltar.
jQuery y jQueryUI están diseñados para ser ''agregados'' a su sitio (de escritorio o móvil). Si desea agregar una función en particular, jQuery o jQueryUI podrían ayudarlo.
jQuery Mobile , sin embargo, es un marco completo. Su intención es ser su punto de partida para un sitio móvil. Requiere jQuery y hace uso de las características de jQuery y jQueryUI para proporcionar tanto componentes de interfaz de usuario como características de API para crear sitios optimizados para dispositivos móviles. Todavía puedes usar tanto o tan poco como quieras, pero jQuery Mobile puede controlar toda la ventana gráfica de una manera amigable para dispositivos móviles si lo permites.
Otra gran diferencia es que jQuery y jQueryUI pretenden ser una capa sobre tu HTML y CSS. Debería poder dejar solo su marcado y mejorarlo con jQuery. Sin embargo, jQuery Mobile proporciona formas de definir dónde desea que aparezcan los componentes utilizando solo HTML, por ejemplo, (desde el sitio jQuery Mobile):
<ul data-role="listview" data-inset="true" data-filter="true">
<li><a href="#">Acura</a></li>
<li><a href="#">Audi</a></li>
<li><a href="#">BMW</a></li>
<li><a href="#">Cadillac</a></li>
<li><a href="#">Ferrari</a></li>
</ul>
El atributo de data-role le dice a jQuery Mobile que convierta esta lista en un componente de interfaz de usuario amigable para dispositivos móviles y los atributos de data-filter y de data-filter establecen propiedades de eso, sin escribir una sola línea de JavaScript. Los componentes de jQueryUI, por otro lado, normalmente se crean escribiendo algunas líneas de JavaScript para crear una instancia del componente en el DOM.