JQuery

JQuery

El manual de jQuery pretende explicar el popular framework Javascript jQuery, con el que podremos hacer aplicaciones web avanzadas del lado del cliente.

 

 

Listado de los capítulos

Introducción a jQuery

Comenzamos por los capítulos más básicos sobre jQuery, que sirven para introducirnos en el desarrollo de una manera sencilla. Hablaremos sobre la metodología de trabajo con el framework Javascript de manera general.

1.- Introducción a jQuery
Qué es jQuery, para qué sirve y qué ventajas tiene el utilizar este framework Javascript. Entrar

2.- Demo muy simple de uso de jQuery
Vamos a hacer nuestro primer script en jQuery, con unas funcionalidades muy simples, para que sirva de demo de uso de este framework. Entrar

3.- Pasos para utilizar jQuery en tu página web
Una descripción de la puesta en marcha de tu primer script jQuery, en tu propia página web, paso a paso. Entrar

4.- Básicos jQuery: añadir y quitar clases CSS sobre elementos
Otro ejemplo básico con jQuery, para mostrar cómo se pueden añadir y quitar clases CSS a elementos de la página, bajo respuesta de eventos de usuario. Entrar

5.- Mostrar y ocultar elementos de la página con jQuery
Con el método css() de jQuery podemos aplicar cualquier estilo css a elementos de la página. Veremos cómo aplicarlo para mostrar y ocultar elementos de la página. Entrar

6.- Efectos rápidos con jQuery
Algunos efectos dinámicos se pueden hacer con jQuery con rapidez impactante y extremadamente poco código Javascript. Entrar

7.- Callback de funciones jQuery
Con callback de jQuery podemos hacer una secuencia de llamadas a funciones o una pila de funciones que se ejecutarán una detrás de otra. Entrar

8.- Uso de Ajax muy sencillo con jQuery
Es muy fácil desarrollar Ajax en jQuery. En este artículo veremos el ejemplo más sencillo de Ajax con el framework Javascript jQuery. Entrar

9.- Ajax jQuery con mensaje de carga
Vemos más posibilidades de Ajax en jQuery, modificando un ejemplo anterior, para crear un mensaje de carga mientras que el usuario espera la respuesta Ajax del servidor. Entrar

 

Core de jQuery

Empezamos a adentrarnos en el framework Javascript para conocer los detalles de este sistema, comenzando con el núcleo de jQuery: el core, que contiene los métodos más esenciales.

10.- Core de jQuery
El core de jQuery lo forman las funciones más recurridas y que forman la base sobre la que se asienta el cualquier cosa en este framework Javascript. Entrar

11.- Función jQuery o función $()
Veremos con detalle la función más importante de jQuery y para ello comenzaremos viendo su uso más común: seleccionar elementos de la página y obtener un objeto jQuery con los elementos seleccionados. Entrar

12.- Otros usos de la función $()
La función jQuery(), o con su abreviación $(), tiene otros usos interesantes cuando le enviamos parámetros distintos a los vistos en el artículo anterior. Entrar

13.- Core/each: each del core de jQuery
Conozcamos con detalle el método each del core de jQuery, para ejecutar una función en cada uno de los elementos de un grupo. Entrar

14.- Método size() y propiedad length del core de jQuery
Dos formas de acceder al número de elementos que hay en un objeto jQuery, a través del método size() y la propiedad length. Entrar

15.- Método data() Core jQuery
El método data() del core de jQuery sirve para almacenar información en los elementos de la página, en pares nombre de variable y valor. Veremos también el método removeData() para eliminar datos almacenados. Entrar

16.- Consideraciones interesantes de data() y removeData()
Ahora veremos algunos puntos interesantes y nuevos ejemplos sobre el funcionamiento de los métodos data() y removeData() de jQuery. Entrar

 

Selectores de jQuery

Comenzamos a analizar en profundidad las diferentes maneras que tenemos en jQuery de seleccionar conjuntos de elementos de la página, a través de distintos tipos de selectores.

17.- Selectores en jQuery
Los selectores sirven para seleccionar elementos de la página a partir de una cadena de texto que le pasamos a la función jQuery. Entrar

18.- Ejemplo para practicar con selectores en jQuery
Ejemplo de página que nos permitirá hacer prácticas con los selectores de jQuery. Entrar

19.- Selectores de Jerarquía en jQuery
Selectores que sirven para seleccionar elementos atendiendo a la estructura o jerarquía de las etiquetas de la página. Entrar

 

Métodos de Attributes en jQuery

Exploramos diferentes métodos que existen en este framework Javascript para acceder y modificar los atributos del DOM, es decir, de los objetos o elementos que forman parte de una página web.

20.- Acceder y modificar atributos HTML desde jQuery
En jQuery existe una función llamada attr() que sirve para recuperar y alterar atributos de los elementos de la página. Entrar

21.- Método attr() de jQuery, otros usos y removeAttr()
Un uso adicional del método attr() de jQuery, para modificar atributos con el valor devuelto de una función y borrar atributos de elementos de la página con removeAttr(). Entrar

 

Métodos de CSS de jQuery

Los métodos que tienen que ver con las propiedades de Hojas de Estilo en Cascada, para acceder o alterar los valores CSS de los elementos de la página dinámicamente.

22.- Método css() de jQuery
Sin duda css() es uno de los métodos más utilizados en el día a día del trabajo con jQuery. Sirve para cambiar y obtener el valor de cualquier atributo css. Entrar

23.- Funciones CSS de jQuery para conocer el tamaño y posición de elementos
Seguimos viendo funciones CSS del framework Javascript jQuery, en este caso las que sirven para conocer el tamaño y posición de los elementos en la página. Entrar

 

Eventos en jQuery

Los eventos son una parte fundamental en el desarrollo de aplicaciones enriquecidas del lado del cliente. Aprendemos todo sobre los eventos en jQuery.

24.- Eventos en jQuery
Una introducción al trabajo con eventos en el framework Javascript jQuery. Entrar

25.- Manejadores de eventos en jQuery
Un listado con los distintos manejadores eventos que podemos definir en jQuery, ordenados por los tipos eventos de ratón, eventos de teclado o cualquiera de los dos. Entrar

26.- Introducción Objeto evento en jQuery
Explicaciones iniciales sobre el objeto evento en jQuery y mostramos cómo averiguar la posición del ratón al producirse un evento en la página. Entrar

27.- Eventos de ratón en jQuery mouseenter y mouseleave
Práctica con eventos de ratón en jQuery, en la que mostraremos el uso de mouseenter y mouseleave, junto con el objeto evento, para averiguar la posición del ratón. Entrar

28.- Eventos de teclado en jQuery
Cómo trabajar con eventos de teclado en jQuery y saber qué teclas han pulsado los usuarios, a través de la propiedad which del objeto evento. Entrar

29.- Definir eventos con bind() y eliminarlos con unbind()
El método bind() sirve para definir eventos de manera genérica, de cualquier tipo. Con el método unbind() podemos eliminar un manejador cualquiera indicado con bind(). Entrar

30.- Eventos definidos con live() en jQuery
Método live() para definir eventos en jQuery: cómo crear eventos sobre elementos que coincidan con un selector, en el momento actual o en el futuro. Entrar

 

Desarrollo de plugins en jQuery

Los plugins en jQuery nos permiten hacer desarrollos que podremos reutilizar con facilidad en diversos sitios y que también podrán usar otros desarrolladores. Los plugins te ayudarán a hacer código de calidad en jQuery.

31.- Plugins en jQuery
Veamos qué son los Plugins en jQuery y cómo podemos crearlos para expandir las posibilidades del framework. Entrar

32.- Reglas para el desarrollo de plugins en jQuery
Para construir plugins en jQuery tenemos que seguir una serie de normas. Además veremos un nuevo ejemplo práctico sobre el desarrollo de plugins en jQuery. Entrar

33.- Plugin jQuery: textarea con cuenta de caracteres
Segundo ejemplo de plugin práctico en jQuery para hacer textarea que lleva la cuenta de los caracteres escritos por el usuario. Entrar

34.- Gestión de opciones en plugins jQuery
Manera de gestionar opciones en los plugins de jQuery, a través de un objeto de options enviado al invocar el plugin, para hacerlos un poco más versátiles y con configuración más fácil. Entrar

35.- Plugin Tip con opciones en jQuery
Un ejemplo de plugin en jQuery para hacer un sistema de tip más avanzado, que permite configurarse por medio de unas opciones en el plugin. Entrar

36.- Funciones y variables dentro de plugins jQuery
Las funciones en los plugins pueden verse como funciones y variables privadas del plugin, que nos sirven para definir una mejor lógica de programación y estructura de datos y código. Entrar

37.- Plugin checkbox personalizado con jQuery
Un plugin en jQuery para hacer un campo de formulario checkbox pero con un diseño distinto, totalmente personalizable por el desarrollador. Entrar

38.- Alias personalizado y ocultar código en plugins jQuery
Cómo crear un alias personalizado a $, para mejorar la compatibilidad en todos los contextos, y ocultar el código privado de los plugins jQuery. Entrar

 

Efectos en jQuery

Los efectos son una de las partes más atractivas del framework y que permitirán dotar de dinamismo a nuestra página, hacerla más atractiva y en definitiva, mejorar la experiencia del usuario.

39.- jQuery animate(): Animación de propiedades CSS
El método animate() de jQuery permite animar varias propiedades, con valores numéricos, de CSS en un solo paso. Entrar

40.- Fading en jQuery
Efectos de cambio de opacidad de los elementos en la página, con los métodos de fading en jQuery, fadeIn(), fadeOut() y fadeTo(). Entrar

41.- Colas de efectos en jQuery
Vamos a explicar qué es una cola de efectos, para qué nos sirve y cómo se configuran las colas de efectos en el framework Javascript jQuery. Entrar

42.- Método queue() para acceder a una cola de efectos
Veremos cómo hacer cosas con las colas de efectos en jQuery, haciendo nuestra primera prueba con el método queue(), que permite acceder y modificar la cola de efectos. Entrar

43.- Meter cualquier tipo de función en una cola de efectos jQuery
En la cola de efectos podemos introducir cualquier tipo de función, aunque no sean efectos jQuery, y para ello vamos a aprender a encolar cualquier conjunto de sentencias con el método queue(). Entrar

44.- Parar la ejecución de una cola de efectos jQuery
Cómo detener la ejecución de una cola de efectos con el método stop() y revisión del uso de queue() para indicar una nueva lista de funciones de efectos a ejecutar con jQuery. Entrar

45.- Método delay() para retrasar la ejecución efectos de la cola
El método delay() de jQuery sirve para generar un intervalo de espera entre la ejecución de funciones de la cola de efectos. Entrar

46.- Cola de efectos personal (no predeterminada) en jQuery
Vamos a mostrar cómo trabajar con otras colas de efectos distintas que la cola de efectos predeterminada. Entrar

47.- Mejorar el plugin navegador desplegable en jQuery con efectos especiales
Implementamos efectos en el navegador desplegable jQuery, aplicando conocimientos de colas de efectos, para hacer un plugin de navegación más vistoso. Entrar

48.- Método jQuery.extend()
Uno de los métodos del paquete utilities de jQuery, que sirve para extender el contenido de dos o más objetos en uno de ellos. Entrar

 

Haciendo click en los enlaces podra ir directo a la fuente de la DesarrolloWeb.com

Responder

Introduce tus datos o haz clic en un icono para iniciar sesión:

Logo de WordPress.com

Estás comentando usando tu cuenta de WordPress.com. Cerrar sesión / Cambiar )

Imagen de Twitter

Estás comentando usando tu cuenta de Twitter. Cerrar sesión / Cambiar )

Foto de Facebook

Estás comentando usando tu cuenta de Facebook. Cerrar sesión / Cambiar )

Google+ photo

Estás comentando usando tu cuenta de Google+. Cerrar sesión / Cambiar )

Conectando a %s