Javascript

jQuery Masonry: encaja capas HTML

ByLuis June 2, 2009

Supongo que lo de “encajar capas HTML” no es algo que se entienda muy bien, pero realmente se trata de eso. Este plugin de jQuery coloca las capas HTHL de tal forma que no queden espacios en blanco entre ellas (algo normal cuando se usa el css float).

Hay que tener cuidado, porque aunque nos devuelve un layout sin espacios en blanco, también nos lo da con un orden no muy usable, por lo que es importante no usar este plugin cuando el orden de colocación importa.
jQuery Masonry
Vía / WebAppers

Javascript

Explicación para el ‘obtect literal’ en Javascript

ByLuis March 20, 2006

Muchas veces nuestra forma de aprender Javascript (o cualquier otra cosa) es encontrándonos con cosas desconocidas en scripts que estamos viendo e intentando comprender.

Una de estas nuevas posibilidades que nos ofrece Javascript son los “obtect literal”. Que sustituyen la falta de clases en Javascript, y nos facilita el uso de variables globales entre otras cosas.

Alguna vez te habrás encontrado con algo parecido al siguiente código y lo habrás querido comprender, una sencilla explicación nos la ofrece Wait till I come.

miObjeto={
miVariable:'valor',
init:function(){
},
hazAlgo:function(){
}
}

Show love to the object literal

Vía / DOM Scripting Task Force

Javascript

Algunos scripts para jQuery

ByLuis October 30, 2008

He encontrado en Script & Style algunos scripts/pluigns para jQuery que son interesantes:

Linkselect: transforma elementos select en listas de enlaces con forma de select.
URL parser: nos permite obtener datos de una URL: protocolo, query, puerto, …
Virtual jQuery Keyboard: añade un teclado virtual a cajas de texto
Word-counter for textarea: el título lo dice todo, cuenta las palabras que hay en un textarea
Smooth popup: crear un popup no modal
idTabs: ayuda a crear pestañas de forma sencilla
dwFadingLinks: crea el efecto fadding en los links cuando se produce un onmouseover
ColorPicker: selector de color

Javascript

FancyBox: zoom de imágenes mediante Javascript

ByLuis April 3, 2008

Buen script creado en jQuery que permite añadir zoom a imágenes. Está testado en IE6, IE7 y Firefox. Entre las características muestra en una ventana lightbox la imagen en un tamaño mayor, pudiendo ajustarse al tamaño de la ventana y mostrando un marco alrededor de la imagen. Además permite mostrar un grupo de imágenes de forma común.

Un ejemplo de uso sería el siguiente:

$(function() {
$("div#test_zone a").fancybox();
});

FancyBox

Javascript

Plugin jQuery para validar contraseñas

ByLuis May 26, 2009

Aquellos que necesiten que en su aplicación web los usuarios introduzcan contraseñas seguras, podrán añadir este plugin jQuery que comprobará si las contraseñas tienen ciertas carácterísticas que las hacen seguras:

Uso de mayúsculas y minúsculas
Uso de números
Uso de caracteres especiales
Longitud de la contraseña
U opcionalmente similar a un username

El plugin mostrará un mensaje indicando la calidad de la contraseña y un color acorde a ésta.

jQuery plugin: Password Validation

Vía / Script & Style

Javascript

Ejemplos de javascripts optimizados

ByLuis February 27, 2007

Si el otro dÃa os contÃ¡bamos cÃ³mo agilizar tus javascripts, hoy os hacemos referencia a ejemplos sobre esos consejos.
Aunque si soy sincero, no tengo muy claro que se gane mucho tiempo cargando dinÃ¡micamente los scripts y retrasando la ejecuciÃ³n para esperar a que se cargue. O si realmente hay diferencia, que no serÃ¡ mucha y menos con las velocidades que suele tener actualmente la mayoria de la gente, si merece la pena tanta cosa. Si el script lo cargamos inicialmente y luego lo utilizamos en todas nuestras pÃ¡ginas, la optimizaciÃ³n serÃa suficiente.
Yo creo que la mejor soluciÃ³n es no tirar tanto de librerÃas y crear los scripts necesarios para tu aplicaciÃ³n.
Speed Up Your Javascript, Part 2: Downloadable Examples!
VÃa / Dzone

Javascript

Permitir el botón atrás en aplicaciones dinámicas

ByLuis April 25, 2010

Cuando realizamos aplicaciones dinámicas, ya sea usando Ajax o mediante javascript mostrando u ocultando contenidos, nos podemos encontrar con el problema de que el usuario pulse el botón ‘Atrás’ del navegador creyendo que accederá al contenido anterior. El resultado de esa acción será en la mayoría de los casos que el usuario acceda a la página anterior y no al ‘contenido’ anterior.

Para solucionar esto, lo que se debe hacer es que las acciones dinámicas sean realizadas mediante enlaces (#), por ejemplo, si queremos usar pestañas podemos acceder a #tab1, #tab2, …, #tabn. Si vamos atrás en el navegador continuaremos en la misma página pero en otra sección (#).

Para tratar esto mediante jQuery se puede hacer usando el siguiente código:

$(window).bind('hashchange', function () {
  // hacer lo que sea para mostrar el contenido
});

Enabling the Back Button

Vía / CSS Globe

Similar Posts