Manual de jQuery Mobile

Manual de jQuery Mobile, el framework para el desarrollo compatible de sitios web orientados a dispositivos móviles, basado en el popular jQuery.

Listado de los capítulos
1.- Introducción a jQuery Mobile
Características de jQuery Mobile, el framework Javascript para desarrollo de aplicaciones web para móviles, basado en jQuery. Entrar

2.- Configuraciones por defecto de jQuery Mobile
Breve introducción a las configuraciones predeterminadas que vienen instaladas con jQuery Mobile y todo lo que ellas involucran. Entrar

3.- Página básica en jQuery Mobile Framework
Cómo es la estructura de la página más básica que podríamos hacer con el framework jQuery Mobile. Entrar

4.- Estructura multipágina de jQuery Mobile
Cómo hacer una página multipágina, de modo que se puedan reunir varias páginas en un archivo HTML, en jQuery Mobile Framework. Entrar

5.- Crear Botones con jQuery Mobile
Crear botones con jQuery Mobile es muy sencillo y no requiere mucho esfuerzo, sin embargo los resultados son excitantes. Entrar

6.- Con jQuery Mobile las listas son mejores
Creación de listas y los usos que le podemos dar en jQuery Mobile dentro de nuestras aplicaciones web móviles. Entrar

7.- Los cuadros de diálogo son diferentes en jQuery Mobile
Cómo crear cuadros de diálogo con jQuery Mobile. Diversos usos y configuraciones que convierten a los cuadros de diálogo una poderosa herramienta. Entrar

8.- Iconos con jQuery Mobile
Para facilitar la creación de interfaces gráficas, jQuery Mobile incluye una gran gama de iconos prediseñados, que podemos incluir en las páginas muy fácilmente. Entrar

9.- Las barras de navegación y transiciones en jQuery Mobile
Artículo dedicado a las barras de navegación, que conseguimos con el role navbar, y las transiciones entre páginas en jQuery Mobile. Entrar

10.- Elemento Slider de jQuery Mobile
Con jQuery Mobile obtenemos elegantes sliders e interruptores, con los que podemos enriquecer visualmente nuestras aplicaciones móviles. Entrar

11.- Elementos Collapsible de jQuery Mobile
Uno de los widgets extraordinariamente atractivos que podemos encontrar en jQuery Mobile son los collapsible. Te explicamos cómo funcionan. Entrar

12.- Hacer columnas y grillas con jQuery Mobile
Creación de documentos web con grillas o contenidos dispuestos en columnas mediante jQuery Mobile. Entrar

13.- Crear temas personalizados para tus aplicaciones jQuery Mobile
El equipo de jQuery Mobile, pone a disposición una herramienta con la cual, podemos crear temas personalizados para las aplicaciones basadas en el framework. Entrar

Descargas
 Si eres usuario de DesarrolloWeb:
Archivo de descarga Manual de jQuery Mobile
exto completo en PDF, listo para imprimir, del manual de DesarrolloWeb.com Manual de jQuery Mobile.
Tamaño: 415 KB
Fecha creación: 19/10/2012
Páginas: 37

Comentarios
Envie un comentario u opinión sobre este manual.

Compartir

Comentarios
Fueron enviados 14 comentarios al manual
5 comentarios no revisados
9 comentarios revisados:

ral_emi...
Más capitulos
04/1/2012
Buenas Tardes.
Quisiera saber si sacarán mas capítulos para este manual ya que tengo más información pero solo en Inglés...

Gracias!
duda
Por: Emanuel
26/1/2012
Estoy quediendo armar una version de mi web para moviles y por lo que veo hasta ahora es muy sencillo. Mi dada es... como hago para detectar si el usuario esta visitando mi web desde un dispositivo y ahi llevarlo a la pagina con jquery movile


Saludos

casadep...
Redireccionar version pc a version movil
15/3/2012
Respondiendo a Emanuel.
Yo puse el siguiente Java en la index pc y me funcional correctamente.
----------------
<script type ="text/javascript" >
//<![CDATA[

function isMobile(){
var ret=false;

var re=[];
re.push(/Android/gi);
re.push(/Fennec/gi);
re.push(/iPhone/gi);
re.push(/iPad/gi);
re.push(/iPod/gi);
re.push(/BlackBerry/gi);
re.push(/Opera Mini/gi);
re.push(/Opera Mobi/gi);
re.push(/Symbian/gi);
re.push(/PalmOS/gi);

for(var i=0, l=re.length; i<l;i++){
ret=ret || !!re[i].test(navigator.userAgent);
}

ret=ret && window.innerWidth<801;
return ret;
}

if(isMobile()){
location.href="http://url_version_mobil";
}
//]]>

</script>
Duda con header y footer
Por: Esau
21/3/2012
Hola, estoy trabajando en una app con jquery mobile y phonegap, la duda que tengo es como lograr que el header y el footer queden fijos al hacer scroll.

Por defecto tienen la propiedad data-position="fixed" sin embargo al hacer scroll el header y footer desaparecen y al finalizar el scroll vuelven a aparecer y tratan de acomodarse en el top y el bottom respectivamente, el problema con esto que casi nunca lo logran perfectamente y se sitúan en el centro de la pantalla.

Espero alguien pueda ayudarme con esto.

Saludos.

caroto_...
Para el header y footer fijo
06/7/2012
pues es con colocar: data-position="fixed"

Tanto en tu data-role header como footer

:)
No muestra estilos al regresar la infrmación con ajax
Por: Ismael Torres
19/7/2012
Estoy haciendo un desarrollo de mensajes con jquery mobile, tengo una pagina que muestra los mensajes haciendo una llamada mediante jquery y ajax a una pagina php que le reguesa todos los mensajes, el problema es que cuando me regresa los mensajes pierde el formato o css en esa seccion del codigo:<br />
<br />
escript para recibir los mensajes juevos:<br />
<br />
$(&#039;#btMnuevos&#039;).click(function(){<br />
$.ajax({<br />
type: &quot;POST&quot;,<br />
url: &quot;http://localhost/direction/_exe/fastq/mensajes.php&quot;,<br />
cache: false,<br />
dataType: &quot;text&quot;,<br />
success: fnSmensajes<br />
});<br />
$(&quot;#dvPreguntas&quot;).ajaxError(function(event,request,settings,exception){<br />
$(&quot;#dvPreguntas&quot;).html(&quot;Error calling: &quot; + settings.url + &quot;&lt;br /&gt; HTTP Code: &quot; + request.status);<br />
});<br />
function fnSmensajes(data){<br />
$(&quot;#dvPreguntas&quot;).html(data);<br />
}<br />
});<br />
<br />
script php que arma la tabla con los mensajes con los formatos de jquery mobile:<br />
&lt;?<br />
$vrValses = 1;<br />
require(&#039;../../c0nf1g.php&#039;);<br />
$cmPreguntas = &quot;<br />
SELECT<br />
mns_tbPregyresp.cpPreguntaid,<br />
mns_tbPregyresp.cpPregunta,<br />
mns_tbPregyresp.cpFecha<br />
FROM <br />
mns_tbPregyresp<br />
WHERE <br />
mns_tbPregyresp.cpEstatus = &#039;2&#039;<br />
&quot;;<br />
mysql_select_db($stSys[&#039;bdsasc&#039;]);<br />
$rgPreguntas = mysql_query($cmPreguntas);<br />
if($rgPreguntas){<br />
$ttPreguntas = mysql_num_rows($rgPreguntas);<br />
if($ttPreguntas){<br />
$dtPreguntas = mysql_fetch_assoc($rgPreguntas);<br />
$vrPreguntas = &#039;&lt;ul data-role=&quot;listview&quot; data-divider-theme=&quot;b&quot; data-inset=&quot;true&quot; id=&quot;ulPreguntas&quot;&gt;&#039;;<br />
do{<br />
$vrPreguntas .= &#039;<br />
&lt;li&gt;<br />
&lt;a class=&quot;csPregunta&quot; data-dtFecha=&quot;&#039;.$dtPreguntas[&#039;cpFecha&#039;].&#039;&quot; data-dtAsunto=&quot;&#039;.$dtPreguntas[&#039;cpAsunto&#039;].&#039;&quot; data-dtPregunta=&quot;&#039;.$dtPreguntas[&#039;cpPregunta&#039;].&#039;&quot; data-dtPreguntaid=&quot;&#039;.$dtPreguntas[&#039;cpPreguntaid&#039;].&#039;&quot; id=&quot;cpPregunta&#039;.$dtPreguntas[&#039;cpPreguntaid&#039;].&#039;&quot; href=&quot;#dvRmensaje&quot;&gt;<br />
&lt;p class=&quot;ui-li-aside&quot;&gt;&#039;.$dtPreguntas[&#039;cpFecha&#039;].&#039;&lt;/p&gt;<br />
&lt;h3&gt;Titulo&lt;/h3&gt;<br />
&lt;p&gt;&#039;.$dtPreguntas[&#039;cpPregunta&#039;].&#039;&lt;/p&gt;<br />
&lt;/a&gt;<br />
&lt;/li&gt;<br />
&#039;;<br />
}while ($dtPreguntas = mysql_fetch_assoc($rgPreguntas));<br />
$vrPreguntas .= &#039;&lt;/ul&gt;&#039;;<br />
}else{<br />
echo &quot;No hay preguntas que mostrar&quot;;<br />
}<br />
}else{<br />
echo &quot;Ocurrio un error al cargar las preguntas &quot;.mysql_error();<br />
}<br />
echo $vrPreguntas;<br />
?&gt;

carcalu...
Agradecimientos y sugerencias
08/8/2012
Saludos Amigos de Desarrolloweb.com
Les escribo para agradecerles de antemano por sus valiosos aportes realizados a través de la página, he estado leeyendo este manual de jQuery Mobile y me ha parecido muy bueno, asi como otros que he leido anteriormente y he tenido la oportunidad de verlos a traves de los videos.
Queria sugerirles o saber si tienes este manual de jQuery Mobile en video como los demas monotematicos, si no lo tienes seria muy bueno que los hicieran ya que a través de los videos he aprendido mucho.
Gracias nuevamente por sus aportes realizados a través de Desarrolloweb.com.
Saludos.

HakDomi
Jquery Mobiel y MVC
09/8/2012
Estoy implementando Jquery Mobile con MVC 3, aunque me funciona localmente en mi maquina, pero cuando lo publico en un Servidor Windows Server 2003 IIS 6.0 no me da acceso a la pagina. necesito saber cual seria la configuracion de este tipo de Pagina web en el IIS 6.0.

PomyLoc...
Duda JQM
06/11/2012
Buenos Días,
Os planteo mi problema, estoy desarrollando mi web con JQM y varias de las páginas las utilizo con el formato multipágina. Despues en otra página que no es del formato multipágina que esta en otro directorio de mi servidor, realizo un select, mediante javascript obtengo el número seleccionado por el cliente y lo envio a otra página para mostrar la información dependiendo de lo seleccionado. El problema viene ahora envio la variable por la url y al darle al botón de home (Pretendo volver al #home de la página en formato multipagina) no funciona debido a que la url dispone de ?variable=2 al final.
¿Como puedo pasar de otra forma la variable sin que aparezca en la url?
He probado a poner ../../index.html ../../index.html#home pero al volver al home no funcionan los botones de la lista para ir a otras secciones de mi página multipagina.

En otras páginas en las que no tengo select y que se encuentran en otro directorio al index al darle al botón de home vuelve perfectamente y funciona la navegación.

Un saludo y Gracias

En este manual
Descargar manual 1

Categorías relacionadas:

Manuales relacionados
Donaciones
Si piensas que te hemos ayudado y merecemos tu apoyo económico...