Chronoline.js, plugin jQuery para crear líneas de tiempo

Chronoline.js es una librería jQuery que nos permite crear líneas de tiempo. La presentación de los contenidos configurados es de manera horizontal (con scroll), en los que podemos indicar eventos de un día o de N cantidad de días a fin de generar una línea de tiempo extendida.

Para descargarlo y comenzar a usarlo en nuestros proyectos podemos ingresar en http://stoicloofah.github.com/chronoline.js/

Vía http://www.webresourcesdepot.com/chronoline-js-a-javascript-library-for-displaying-timeline-of-events/

Gmap3, un framework jQuery para Google Maps

Gmap3, jQuery para Google Maps

Hace tiempo les contabamos sobre la Clase PHP para generar códigos de barra, una excelente opción para implementar en nuestros trabajos. Gracias a este artículo entramos en contacto con su autor, Jean-Baptiste DEMONTE, que poco a poco nos fue contando sobre sus proyectos.

Gmap3, jQuery para Google Maps

Hoy Jean-Baptiste se encuentra trabajando en Gmap3, un conjunto de herramientas para interactuar con la API de Google Maps, y dejenme decirles que los resultados son de primer nivel.

Basada en la API de Google Maps, Gmap3 nos facilitará la interacción y la creación de mapas con todas las características propuestas por Google: ver mapas, visualizar rutas, modificar las opciones disponibles, crear polígonos y ejecutar Street View, entre otras.

La implementación es sencilla, sólo debemos integrar el JS de Google Maps y el de Gmap3, además de jQuery, para comenzar a utilizar todos los métodos disponibles.

En la Web oficial de Gmap3 podemos ver demos e información detallada sobre la implementación y métodos disponibles.

FireQuery, amplia tu Firebug para controlar jQuery

FireQuery, un complemento Firebug para jQuery

Firebug es sin duda uno de los complementos para Firefox más popular entre los Desarrolladores y con esta ayuda lo será aún más. Con FireQuery podremos explorar y ejecutar sentencias de jQuery desde nuestra consola FireBug, además de explorar los elementos y explotar las clásicas funcionalidades de esta extención.

FireQuery, un complemento Firebug para jQuery

Como la mayoría de las ampliaciones de Firefox es de fácil instalación, sólo debemos tener previamente instalado el Firebug. Además es una herramienta gratuita.

A continuación les dejamos el Video de Demostración expuesto en la página de FireQuery:

Para descargarlo u obtener más información: http://firequery.binaryage.com/

Reconocimiento Facial en jQuery

Hace unos pocos días comentabamos sobre la clase php para reconocer rostros en imágenes.

Hoy, revisando nuestros sitios amigos habituales, nos encontramos con este plugin para jQuery que hace exactamente lo mismo pero, claro está, con jQuery.

Es ideal para agregar a nuestros proyectos que tengan un perfil social, en el cual podamos explotar esta excelente utilidad.

i lo comparamos con la versión publicada en PHP, creo que esta consumira menos recursos debido a que la actividad no se desarrolla en nuestro servidor, sino en la terminal del cliente.

En fin, ya tenemos las dos opciones disponibles. Queda a elección de cada uno si quiere reconocer caras con jquery o detectar rostros con php.

Demo | Descargar Plugin | Ejemplo de uso

Carousel infinito en jQuery

No es la primera vez que hablamos de un Plugin para jQuery en VitaminaGeek.com, un ejemplo similar a este podría ser el Slider jQuery presentado hace unos meses.

En esta oportunidad traemos carouFredSel, un complemtento que toma cualquier elemento html y lo transforma en un carousel sin limite.

Este carousel puede funcionar horizontal o verticalmente, y puede configurarse para correr automaticamente o al ser activado por el usuario.

La instalación es realmente sencilla:

  1. Descarga en Plugin
  2. Incluye en tu documento HTML los archivos necesarios para el funcionamiento del Carousel:
    <script type="text/javascript" src="jquery.js"></script>
    <script type="text/javascript" src="jquery.carouFredSel.js"></script>
  3. Crea los contenidos que deseas incluir en el carousel, por ejemplo:
    <div id="foo">
    <img src="img1.jpg" />
    <img src="img2.jpg" />
    <img src="img3.jpg" />
    <img src="img4.jpg" />
    <img src="img5.jpg" />
    </div>
    

    También puedes hacerlo con otros tags, como pueden ser listas o divs. Lo único que debes tener en cuenta es que este armado en un formato válido.

  4. «Ejecuta» el plugin jQuery:
    $(document).ready(function() {
    // Using default configuration
    $("#foo1").carouFredSel();
    // Using custom configuration
    $("#foo2").carouFredSel({
    items : 2,
    direction : "up",
    scroll : {
    items : 1,
    effect : "easeOutBounce",
    duration : 1000,
    pauseOnHover : true
    }
    });
    });

Puedes ver el listado de opciones disponibles en el plugin en el apartado de configuración: http://caroufredsel.frebsite.nl/configuration.php

Enlace: http://caroufredsel.frebsite.nl/

Quovolver, una buena forma de mostrar citas

Quovolver es un Plugin para jQuery que, basicamente, lo que hace es tomar un tag html previamente indicado y mostrarlo en forma de presentación a nuestros usuarios.

Para instalarlo debemos seguir los siguientes pasos:

1- Descargar y descomprimir los archivos propios del plugin: http://sandbox.sebnitu.com/jquery/quovolver/quovolver_v1.0.zip
El directorio dentro del archivo .zip cuenta con 4 archivos:

* jquery.quovolver.js
* style.css
* readme.txt
* index.html

2- Inserta el archivo del Quovolver (jquery.quovolver.js) dentro de tu documento html:


<script type="text/javascript" src="jquery.quovolver.js"></script>

3- Instancia Quovolver dentro de tu función Document.Ready indicando cual es el tag html que deseas tomar:


<script type="text/javascript">
$(document).ready(function() {
$('blockquote').quovolver();
});
</script>

Y listo! El plugin tomará todos los contenidos de ese tag y los irá presentando como si fueran un slider de quotes. Muy interesante.

Fuente: http://sandbox.sebnitu.com/jquery/quovolver/

Controlar WebCam desde jQuery

jQuery Webcam es un plugin que crea un layer transparente para comunicarse con la webcam directamente desde javascript.

Aprovecha las caracteristicas de SWF (ya viene en el paquete) para mostrar las imagenes de la webcam asi como tambien capturarlas.

El plugin también cuenta con la posibilidad de ver un listado con las cámaras instaladas para seleccionar la de nuestra preferencia.

El streaming puede ser en cualquier tamaño, aunque debemos recompilar el SWF dependiendo del tamaño seleccionado, tal como se describe en la documentación.

Para descargar el Plugin: http://www.xarg.org/project/jquery-webcam-plugin/

Fuente: http://www.webresourcesdepot.com/control-webcams-with-javascript-jquery/

Crea tu propio Slider con jQuery

Sudo Slider es un plugin para jQuery que nos permitirá realizar nuestros propios slides en cualquier documento html.

Este plugin, basado en Easy Slider, nos permitirá crear slides de imagenes o artículos en pocos pasos sin dejar de lado la presentación ni el modo en el que queremos que este se muestre.

Podemos elegir si queremos un slide vertical u horizontal, si queremos que cada pantalla tenga su propio boton o si queremos que nuestro slide sea automatico o manual, entre otras tantas caracteristicas.

Este plugin es pequeño, lo cual no es poca cosa en muchos casos (~10kb) y no es intrusivo.

Algunos ejemplos de su funcionamiento en http://webbies.dk/Sudo%20Slider/demo.html.

Para descargarlo: http://webbies.dk/Sudo Slider/Sudo Slider 1.0.2.zip

Lo encontre en Web Resourses Depot

Crear gráficos de barra con JQuery

DDChart es un plugin para jQuery que nos permitirá crear nuestros propios gráficos de barra.

Este plugin nos dará la posibilidad de crear gráficos sencillos o avanzados. Si lo que deseamos es un gráfico de barra más complejo podremos utilizar las opciones que incluyen efectos y gráficos multiples, mientras que para necesidades más puntuales podremos utilizar la presentación normal.

Para su correcto funcionamiento, DDChart para jQuery necesitará que le entreguemos la información en formato JSON.

Sin duda una excelente opción para cuando busquemos realizar gráficos dinamicamente combinando con PHP u otro tipo de lenguajes.

La página oficial de este Plugin para jQuery: http://kiersimmons.com/DDChart/index.html

Alli podremos encontrar ejemplos y documentación sobre todas las posibilidades que ofrece.

Lo lei en: http://www.webresourcesdepot.com/drill-down-bar-charts-with-jquery-ddchart/