jPrintArea – Plugin jQuery para imprimir determinadas áreas

Aquí tenemos un pequeño y eficaz plugin para jQuery que nos permitirá de manera fácil poder imprimir una determinada área de nuestra página web.

jPrintArea.

jQuery – plugins para filtrar filas en tablas y para crear máscaras en inputs.

A continuación dos plugins de jQuery, uno para filtrar filas en tablas, y otro para crear máscaras en inputs.

Filtro de tablas: Quicksearch.

Máscaras en inputs: Masked input.

jQTouch: HTML5 + CSS + jQuery para móviles

Fantástico plugin para jQuery que permite crear interfaces para aplicaciones web para móviles.

jQTouch.

Chuletas de jQuery

Aquí os pongo algunas hojas de referencia o chuletas que he encontrado de jQuery:

Completa chuleta de dos páginas (via define-web):

Chuleta de jQuery (página 1).
Chuleta de jQuery (página 2).

Colorida y vistosa chuleta a todo color (vía colorchange):

Chuleta jQuery

Chuleta de jQuery a todo color.

Y otra chuleta más, la cual te la puedes descargar en dos paletas de colores.

Chuleta de jQuery a elegir entre dos paletas de colores.

jQuery Cycle Plugin – Transiciones animadas de imágenes (slideshow)

jQuery Cycle plugin proporciona un mecanismo de hacer transiciones animadas de imágenes. Su implementación está basada en el InnerFade Plugin de Torsten Baldes, el Slideshow Plugin de Matt Oakes, y el jqShuffle Plugin de Benjamin Sterling. El plugin soporta pausas al pasar el ratón por encima de la imágen, paradas automáticas, retrollamadas (callbacks) antes y después, disparadores (triggers) y una gran cantidad de efectos para las trasiciones.

La última versión estable (2.34), publicada en esta misma semana, requiere, como mínimo, la versión 1.2.3 de jQuery.

Es un plugin muy ligero, tan solo ocupa 18 KB en su versión para entornos de producción.

Como casi todo en jQuery, es muy fácil de usar. Aquí pongo un breve ejemplo básico:

HTML:

<div id="s1" class="pics">
    <img src="images/beach1.jpg" width="200" height="200" />
    <img src="images/beach2.jpg" width="200" height="200" />
    <img src="images/beach3.jpg" width="200" height="200" />
</div>

CSS:

.pics {
    height:  232px;
    width:   232px;
    padding: 0;
    margin:  0;
} 

.pics img {
    padding: 15px;
    border:  1px solid #ccc;
    background-color: #eee;
    width:  200px;
    height: 200px;
    top:  0;
    left: 0
}

JavaScript:

$('#s1').cycle('fade');

Puedes acceder a la web oficial para obtener más información, la descarga, ejemplos de códigos fuentes y ejemplos en funcionamiento desde el siguiente enlace:

jQuery Cycle Plugin.

jQuery – Hacer que un textarea crezca mientras escribes automáticamente

Coqueto plugin para el framework jQuery con el que podremos implementar un interesante efecto: Hacer que un textarea crezca (verticalmente) dinámicamente mientras el usuario va escribiendo en el, es decir, si el textarea se queda pequeño para el texto que se está escribiendo pues va creciendo una línea.

Desde el siguiente enlace puedes acceder a descargarte el plugin y a ver un ejemplo en funcionamiento:

Elastic – Make your textareas grow facebook style (jQuery plugin).

Una vez incorporado el plugin a nuestro desarrollo web, el uso del mismo es muy fácil:

$('#myTextarea').elastic();

donde #myTextarea es el ID del elemento textarea al que queremos aplicar el efecto.

jQuery – Crear un efecto acordeón

En la siguiente web explican paso a paso (en inglés) y con todo nivel de detalle y código fuente para copiar y pegar, como conseguir un efecto acordeón usando el plugin jQuery para JavaScript.

Exactly How to Create a Custom jQuery Accordion.