https://manuais.iessanclemente.net/index.php?action=history&feed=atom&title=JQuery JQuery - Historial de revisiones 2026-10-21T05:07:30Z Historial de revisiones de esta página en la wiki MediaWiki 1.46.2 https://manuais.iessanclemente.net/index.php?title=JQuery&diff=64539&oldid=prev Veiga: /* SCREENCAST jQuery - Exemplos de programacion con jQuery */ 2018-04-22T16:21:12Z <p><span class="autocomment">SCREENCAST jQuery - Exemplos de programacion con jQuery</span></p> <p><b>Página nueva</b></p><div>= Introducción a jQuery =<br /> == [[¿Por qué jQuery?]] ==<br /> == [[Javascript non intrusivo]] ==<br /> == [[As bases de jQuery]] ==<br /> <br /> = Creación do conxunto de elementos seleccionables =<br /> == [[Seleccionando elementos para a súa manipulación]] ==<br /> == [[Xestionando o conxunto de elementos seleccionables]] ==<br /> == [[Xerando novo contido HTML]] ==<br /> <br /> = Dando vida ás páxinas con jQuery =<br /> == [[Propiedades e atributos dos elementos con jQuery]] ==<br /> == [[Estilos dos elementos con jQuery]] ==<br /> == [[Modificación do contido dos elementos]] ==<br /> <br /> = Mellorando a apariencia con animacións e efectos =<br /> == [[Amosar e ocultar elementos]] ==<br /> == [[Amosar e ocultar empregando animacións]] ==<br /> == [[Creando animacións de usuario específicas]] ==<br /> <br /> = Funcións de utilidade en jQuery =<br /> <br /> == [[Lista de funcións de Utilidade en jQuery]] ==<br /> <br /> = Ajax e jQuery =<br /> == [[Iniciación en Ajax]] ==<br /> == [[Control absoluto dunha petición Ajax]] ==<br /> == [[Cargando contido nos elementos]] ==<br /> == [[Xestionando peticións GET e POST]] ==<br /> == [[Peticións AJAX cross-domain con JSONP]] ==<br /> <br /> = Plugins para jQuery =<br /> == [[O plugin Form en jQuery]] ==<br /> == [http://plugins.jquery.com/project/dimensions O plugin Dimensions en jQuery] ==<br /> == [http://docs.jquery.com/UI O plugin UI en jQuery] ==<br /> <br /> = SCREENCAST jQuery - Exemplos de programacion con jQuery =<br /> <br /> {{Alerta|Sobre os Screencast| Para &#039;&#039;&#039;accesos dende Internet&#039;&#039;&#039; recoméndase escoller o primeiro hiperenlace &#039;&#039;&#039;Screencast&#039;&#039;&#039;.&lt;br&gt; Para &#039;&#039;&#039;accesos dende o IES San Clemente&#039;&#039;&#039;, escoller o enlace equivalente &#039;&#039;&#039;Mirror Instituto&#039;&#039;&#039;.&lt;br&gt;&lt;br&gt;Narración, deseño e programación por Rafael Veiga.}}<br /> <br /> ----<br /> <br /> <br /> &#039;&#039;&#039;&lt;font color=&quot;darkmagenta&quot;&gt;Xa podes suscribirte gratuitamente ós Screencast de jQuery co teu iTunes na Apple Store.&lt;/font&gt;<br /> <br /> &#039;&#039;&#039;Descarga iTunes aqui:&#039;&#039;&#039;<br /> <br /> [http://www.apple.com/es/itunes/download/ http://informatica.iessanclemente.net/manuais/images/5/55/Itunes.jpg]<br /> <br /> <br /> &#039;&#039;&#039;Fai click na imaxen inferior para suscribirte.&#039;&#039;&#039;<br /> <br /> [http://itunes.apple.com/WebObjects/MZStore.woa/wa/viewPodcast?id=305369833 http://informatica.iessanclemente.net/manuais/images/a/a9/JQuery-Itunes-Apple-Store.jpg]<br /> <br /> &#039;&#039;&#039;OUTRA FORMA DE SUSCRIBIRSE ÓS SCREENCAST SIN SER A TRAVÉS DE ITUNES E APPLE STORE:&#039;&#039;&#039;<br /> <br /> &#039;&#039;&#039;1º&#039;&#039;&#039;.- Abre o Itunes.<br /> <br /> &#039;&#039;&#039;2º&#039;&#039;&#039;.- Ir a Avanzado -&gt; Suscribirse a un podcast...<br /> <br /> &#039;&#039;&#039;3º&#039;&#039;&#039;.- Copiar a seguinte URL, pegar na ventada de URL:<br /> <br /> &#039;&#039;&#039;Para screencast visualizables só no PC (alta calidade)&#039;&#039;&#039;: http://www.iessanclemente.net/recurso/itunes/jquery_feed.xml<br /> <br /> &#039;&#039;&#039;Para screencast compatibles con Iphone, Ipod Touch&#039;&#039;&#039;: http://www.iessanclemente.net/recurso/itunes/jquery_ipod_feed.xml<br /> <br /> <br /> <br /> ----<br /> &#039;&#039;&#039;LISTADO DE SCREENCAST DISPOÑIBLES&#039;&#039;&#039;<br /> ----<br /> <br /> <br /> <br /> &lt;font color=darkmagenta&gt;&#039;&#039;&#039;Requisitos previos:&lt;/font&gt;<br /> <br /> &lt;font color=darkmagenta&gt;&#039;&#039;&#039;Instalación dun servidor Web con Apache + MySql + PHP&#039;&#039;&#039; (7,8 MB)&lt;/font&gt; <br /> <br /> &#039;&#039;&#039;Screencast:&#039;&#039;&#039; [http://www.iessanclemente.net/recurso/screencast/xampp2/ Instalación de XAMPP] <br /> <br /> &#039;&#039;&#039;Mirror Instituto:&#039;&#039;&#039; [http://informatica.iessanclemente.net/screencast/xampp2/ Instalación de XAMPP]<br /> <br /> <br /> &lt;font color=darkmagenta&gt;&#039;&#039;&#039;Creación de usuarios MySQL para su uso en las páginas PHP con phpMyadmin.&#039;&#039;&#039; (11.6 MB)&lt;/font&gt;<br /> <br /> &#039;&#039;&#039;Screencast:&#039;&#039;&#039; [http://www.iessanclemente.net/recurso/screencast/mysql/ Creacion Usuarios en MySQL con phpMyadmin]<br /> <br /> &#039;&#039;&#039;Mirror Instituto:&#039;&#039;&#039; [http://informatica.iessanclemente.net/screencast/mysql/ Creacion Usuarios en MySQL con phpMyadmin]<br /> <br /> ----<br /> ----<br /> &lt;font color=darkmagenta&gt; &#039;&#039;&#039;Exemplo 0:&#039;&#039;&#039;&lt;/font&gt;<br /> <br /> &#039;&#039;&#039;Introducción a jQuery - Parte 1/2 - HD Youtube&#039;&#039;&#039;<br /> {{#ev:youtube|V6gNj4a0MZg}}<br /> <br /> &#039;&#039;&#039;Introducción a jQuery - Parte 2/2 - HD Youtube&#039;&#039;&#039;<br /> {{#ev:youtube|YkXTw0cQpj0}}<br /> ----<br /> <br /> ----<br /> &lt;font color=darkmagenta&gt; &#039;&#039;&#039;Exemplo 1:&#039;&#039;&#039; (9.23 Mb)&lt;/font&gt;<br /> <br /> &#039;&#039;&#039;Screencast:&#039;&#039;&#039; [http://www.iessanclemente.net/recurso/screencast/jquery1/ jQuery 1 - Filas pares de una tabla en color diferente.] <br /> &#039;&#039;&#039;Mirror Instituto:&#039;&#039;&#039; [http://informatica.iessanclemente.net/screencast/jquery1/ jQuery 1 - Filas pares de una tabla en color diferente.] <br /> <br /> &#039;&#039;&#039;Filas pares de una tabla en color diferente - HD Youtube&#039;&#039;&#039;<br /> {{#ev:youtube|oj-ktOyHzao}}<br /> <br /> &#039;&#039;&#039;Arquivos exemplo:&#039;&#039;&#039; [http://www.iessanclemente.net/recurso/screencast/jquery1/jquery1.zip jquery1.zip] &#039;&#039;&#039;Mirror Instituto:&#039;&#039;&#039; [http://informatica.iessanclemente.net/screencast/jquery1/jquery1.zip jquery1.zip] <br /> ----<br /> ----<br /> &lt;font color=darkmagenta&gt; &#039;&#039;&#039;Exemplo 2:&#039;&#039;&#039; (17.2 Mb)&lt;/font&gt;<br /> <br /> &#039;&#039;&#039;Screencast:&#039;&#039;&#039; [http://www.iessanclemente.net/recurso/screencast/jquery2/ jQuery 2 - Trabajando con enlaces.] <br /> &#039;&#039;&#039;Mirror Instituto:&#039;&#039;&#039; [http://informatica.iessanclemente.net/screencast/jquery2/ jQuery 2 - Trabajando con enlaces.] <br /> <br /> &#039;&#039;&#039;Trabajando con enlaces - Youtube&#039;&#039;&#039;<br /> {{#ev:youtube|f5OEAlWx46M}}<br /> <br /> <br /> &#039;&#039;&#039;Arquivos exemplo:&#039;&#039;&#039; [http://www.iessanclemente.net/recurso/screencast/jquery2/jquery2.zip jquery2.zip] &#039;&#039;&#039;Mirror Instituto:&#039;&#039;&#039; [http://informatica.iessanclemente.net/screencast/jquery2/jquery2.zip jquery2.zip] <br /> ----<br /> ----<br /> &lt;font color=darkmagenta&gt; &#039;&#039;&#039;Exemplo 3:&#039;&#039;&#039; -&gt; (9.43 Mb)&lt;/font&gt;<br /> <br /> &#039;&#039;&#039;Screencast:&#039;&#039;&#039; [http://www.iessanclemente.net/recurso/screencast/jquery3/ jQuery 3 - Iconos en enlaces segun tipo de archivo.] <br /> &#039;&#039;&#039;Mirror Instituto:&#039;&#039;&#039; [http://informatica.iessanclemente.net/screencast/jquery3/ jQuery 3 - Iconos en enlaces segun tipo de archivo.] <br /> <br /> &#039;&#039;&#039;Iconos en enlaces segun tipo de archivo - HD Youtube&#039;&#039;&#039;<br /> {{#ev:youtube|dp4cIWHVWEc}}<br /> <br /> &#039;&#039;&#039;Arquivos exemplo:&#039;&#039;&#039; [http://www.iessanclemente.net/recurso/screencast/jquery3/jquery3.zip jquery3.zip] &#039;&#039;&#039;Mirror Instituto:&#039;&#039;&#039; [http://informatica.iessanclemente.net/screencast/jquery3/jquery3.zip jquery3.zip] <br /> ----<br /> ----<br /> &lt;font color=darkmagenta&gt; &#039;&#039;&#039;Exemplo 4:&#039;&#039;&#039; (17.6 Mb)&lt;/font&gt;<br /> <br /> &#039;&#039;&#039;Screencast:&#039;&#039;&#039; [http://www.iessanclemente.net/recurso/screencast/jquery4/ jQuery 4 - Menú desplegable con efectos dinámicos.] <br /> &#039;&#039;&#039;Mirror Instituto:&#039;&#039;&#039; [http://informatica.iessanclemente.net/screencast/jquery4/ jQuery 4 - Menú desplegable con efectos dinámicos.] <br /> <br /> &#039;&#039;&#039;Menú desplegable con efectos dinámicos - HD Youtube&#039;&#039;&#039;<br /> {{#ev:youtube|j5I5Dum4DA8}}<br /> <br /> &#039;&#039;&#039;Arquivos exemplo:&#039;&#039;&#039; [http://www.iessanclemente.net/recurso/screencast/jquery4/jquery4.zip jquery4.zip] &#039;&#039;&#039;Mirror Instituto:&#039;&#039;&#039; [http://informatica.iessanclemente.net/screencast/jquery4/jquery4.zip jquery4.zip] <br /> ----<br /> ----<br /> &lt;font color=darkmagenta&gt; &#039;&#039;&#039;Exemplo 5:&#039;&#039;&#039; (14.6 Mb)&lt;/font&gt;<br /> <br /> &#039;&#039;&#039;Screencast:&#039;&#039;&#039; [http://www.iessanclemente.net/recurso/screencast/jquery5/ jQuery 5 - Rollover con efecto de difuminado.] <br /> &#039;&#039;&#039;Mirror Instituto:&#039;&#039;&#039; [http://informatica.iessanclemente.net/screencast/jquery5/ jQuery 5 - Rollover con efecto de difuminado.]<br /> <br /> &#039;&#039;&#039;Rollover con efecto difuminado - HD Youtube&#039;&#039;&#039;<br /> {{#ev:youtube|hC94Ks8SnFE}}<br /> <br /> &#039;&#039;&#039;Arquivos exemplo:&#039;&#039;&#039; [http://www.iessanclemente.net/recurso/screencast/jquery5/jquery5.zip jquery5.zip] &#039;&#039;&#039;Mirror Instituto:&#039;&#039;&#039; [http://informatica.iessanclemente.net/screencast/jquery5/jquery5.zip jquery5.zip] <br /> ----<br /> ----<br /> &lt;font color=darkmagenta&gt; &#039;&#039;&#039;Exemplo 6:&#039;&#039;&#039; (22.4 Mb)&lt;/font&gt;<br /> <br /> &#039;&#039;&#039;Screencast:&#039;&#039;&#039; [http://www.iessanclemente.net/recurso/screencast/jquery6/ jQuery 6 - Validación de un formulario con plugin Validate.] <br /> &#039;&#039;&#039;Mirror Instituto:&#039;&#039;&#039; [http://informatica.iessanclemente.net/screencast/jquery6/ jQuery 6 - Validación de un formulario con plugin Validate.]<br /> <br /> &#039;&#039;&#039;Arquivos exemplo:&#039;&#039;&#039; [http://www.iessanclemente.net/recurso/screencast/jquery6/jquery6.zip jquery6.zip] &#039;&#039;&#039;Mirror Instituto:&#039;&#039;&#039; [http://informatica.iessanclemente.net/screencast/jquery6/jquery6.zip jquery6.zip] <br /> ----<br /> ----<br /> &lt;font color=darkmagenta&gt; &#039;&#039;&#039;Introduccion Ajax: (sen emprego de librerías)&#039;&#039;&#039; (23.5 Mb)&lt;/font&gt;<br /> <br /> &#039;&#039;&#039;Screencast:&#039;&#039;&#039; [http://www.iessanclemente.net/recurso/screencast/introajax/ Introducción a Ajax e ó obxecto XMLHttpRequest] <br /> &#039;&#039;&#039;Mirror Instituto:&#039;&#039;&#039; [http://informatica.iessanclemente.net/screencast/introajax/ Introducción a Ajax e ó obxecto XMLHttpRequest]<br /> <br /> &#039;&#039;&#039;Arquivos exemplo:&#039;&#039;&#039; [http://www.iessanclemente.net/recurso/screencast/introajax/introajax.zip introajax.zip] &#039;&#039;&#039;Mirror Instituto:&#039;&#039;&#039; [http://informatica.iessanclemente.net/screencast/introajax/introajax.zip introajax.zip] <br /> ----<br /> ----<br /> &lt;font color=darkmagenta&gt; &#039;&#039;&#039;Exemplo 7:&#039;&#039;&#039; (32.0 Mb)&lt;/font&gt;<br /> <br /> &#039;&#039;&#039;Screencast:&#039;&#039;&#039; [http://www.iessanclemente.net/recurso/screencast/jquery7/ jQuery 7 - Formulario con Ajax.] <br /> &#039;&#039;&#039;Mirror Instituto:&#039;&#039;&#039; [http://informatica.iessanclemente.net/screencast/jquery7/ jQuery 7 - Formulario con Ajax.]<br /> <br /> &#039;&#039;&#039;Arquivos exemplo:&#039;&#039;&#039; [http://www.iessanclemente.net/recurso/screencast/jquery7/jquery7.zip jquery7.zip] &#039;&#039;&#039;Mirror Instituto:&#039;&#039;&#039; [http://informatica.iessanclemente.net/screencast/jquery7/jquery7.zip jquery7.zip] <br /> ----<br /> ----<br /> &lt;font color=darkmagenta&gt; &#039;&#039;&#039;Exemplo 8:&#039;&#039;&#039; (57.6 Mb)&lt;/font&gt;<br /> <br /> &#039;&#039;&#039;Screencast:&#039;&#039;&#039; [http://www.iessanclemente.net/recurso/screencast/jquery8/ jQuery 8 - Formulario Ajax con métodos $.ajax() y $.post().] <br /> &#039;&#039;&#039;Mirror Instituto:&#039;&#039;&#039; [http://informatica.iessanclemente.net/screencast/jquery8/ jQuery 8 - Formulario Ajax con métodos $.ajax() y $.post().]<br /> <br /> &#039;&#039;&#039;Arquivos exemplo:&#039;&#039;&#039; [http://www.iessanclemente.net/recurso/screencast/jquery8/jquery8.zip jquery8.zip] &#039;&#039;&#039;Mirror Instituto:&#039;&#039;&#039; [http://informatica.iessanclemente.net/screencast/jquery8/jquery8.zip jquery8.zip] <br /> ----<br /> ----<br /> &lt;font color=darkmagenta&gt; &#039;&#039;&#039;Exemplo 9:&#039;&#039;&#039; (47.5 Mb)&lt;/font&gt;<br /> <br /> &#039;&#039;&#039;Screencast:&#039;&#039;&#039; [http://www.iessanclemente.net/recurso/screencast/jquery9/ jQuery 9 - Aplicación Ajax similar a Google Suggest.] <br /> &#039;&#039;&#039;Mirror Instituto:&#039;&#039;&#039; [http://informatica.iessanclemente.net/screencast/jquery9/ jQuery 9 - Aplicación Ajax similar a Google Suggest.]<br /> <br /> &#039;&#039;&#039;Arquivos exemplo:&#039;&#039;&#039; [http://www.iessanclemente.net/recurso/screencast/jquery9/jquery9.zip jquery9.zip] &#039;&#039;&#039;Mirror Instituto:&#039;&#039;&#039; [http://informatica.iessanclemente.net/screencast/jquery9/jquery9.zip jquery9.zip] <br /> ----<br /> ----<br /> &lt;font color=darkmagenta&gt; &#039;&#039;&#039;Exemplo 10:&#039;&#039;&#039; (16.3 Mb)&lt;/font&gt;<br /> <br /> &#039;&#039;&#039;Screencast:&#039;&#039;&#039; [http://www.iessanclemente.net/recurso/screencast/jquery10/ jQuery 10 - Conversion de formulario estándar a Ajax.] <br /> &#039;&#039;&#039;Mirror Instituto:&#039;&#039;&#039; [http://informatica.iessanclemente.net/screencast/jquery10/ jQuery 10 - Conversion de formulario estándar a Ajax.]<br /> <br /> &#039;&#039;&#039;Conversion de formulario estándar a Ajax - HD Youtube&#039;&#039;&#039;<br /> {{#ev:youtube|2Z1fcqagb0E}}<br /> <br /> &#039;&#039;&#039;Arquivos exemplo:&#039;&#039;&#039; [http://www.iessanclemente.net/recurso/screencast/jquery10/jquery10.zip jquery10.zip] &#039;&#039;&#039;Mirror Instituto:&#039;&#039;&#039; [http://informatica.iessanclemente.net/screencast/jquery10/jquery10.zip jquery10.zip] <br /> ----<br /> ----<br /> &lt;font color=darkmagenta&gt; &#039;&#039;&#039;Extensión Firebug:&#039;&#039;&#039; (45.3 Mb)&lt;/font&gt;<br /> <br /> &#039;&#039;&#039;Screencast:&#039;&#039;&#039; [http://www.iessanclemente.net/recurso/screencast/firebug/ Extensión Firebug - Introducción básica de uso.] <br /> &#039;&#039;&#039;Mirror Instituto:&#039;&#039;&#039; [http://informatica.iessanclemente.net/screencast/firebug/ Extensión Firebug - Introducción básica de uso.] <br /> <br /> &#039;&#039;&#039;Extensión Firebug - Introducción básica de uso - HD Youtube&#039;&#039;&#039;<br /> {{#ev:youtube|RVGtBUDkf-8}}<br /> ----<br /> ----<br /> <br /> == Créditos e Enlaces interesantes==<br /> <br /> Fontes e recursos empregados no manual:<br /> <br /> [http://www.jquery.com Páxina oficial de jQuery]<br /> <br /> [http://docs.jquery.com/Tutorials Tutoriais de jQuery]<br /> <br /> [http://visualjquery.com/ jQuery Visual]<br /> <br /> [http://www.manning.com/bibeault/ jQuery in Action]<br /> <br /> [http://www.jqwidgets.com/ jqwidgets.com]<br /> <br /> [http://informatica.iessanclemente.net/labs/chapter2/lab.selectors.html Laboratorio de Selectores CSS]<br /> <br /> == Guías Rápidas de jQuery == <br /> <br /> [http://informatica.iessanclemente.net/manuais/images/8/81/Jquery.cheatsheet.1.5.pdf Guia Rápida jQuery 1.5]<br /> <br /> [http://informatica.iessanclemente.net/manuais/images/2/28/JQuery-Visual-Cheat-Sheet-1.4.2.pdf Guía Rápida jQuery 1.4.2]<br /> <br /> [http://informatica.iessanclemente.net/manuais/images/8/8d/Guia-Rapida-jQuery.pdf Otra Guia Rápida de jQuery]<br /> <br /> [[Usuario:Veiga|Veiga]] ([[Usuario discusión:Veiga|discusión]]) 18:21 22 abr 2018 (CEST)</div> Veiga