BLOG DE DESARROLLO WEB

RECURSOS Y NOTICIAS ÚTILES EN TODOS LOS NIVELES PARA CUALQUIER DESARROLLADOR WEB...

11 de Octubre de 2011 4,021 veces Ver comentarios

Gallery Focus es un plugin escrito en javascript y basado en la librería jQuery, que nos permite desenfocar (hacer fade) elementos según proximidad. Es decir, según donde ubiquemos el ratón, podemos desenfocar todos los elementos alrededor del puntero con opciones personalizables.

Su implementación es muy sencilla, se debe definir el tamaño del área a desenfocar, la opacidad del resto de elementos no afectados por el desenfoque y si persigue al ratón o no, y algunas opciones más... pero las importantes son éstas 3 que mencioné.

LEER ENTRADA

05 de Octubre de 2011 4,960 veces Ver comentarios

Es bien conocido que poner una dirección de correo electrónico en la web es sinónimo de empezar a recibir correos no deseados de toda clase, por eso, a raíz de un proyecto que estoy maquetando, reescribí una función que encontré en Stack Overflow para adaptarla a mis necesidades.

La función es muy sencilla y se encargará de reescribir mediante javascript (jQuery en este caso) una dirección de correo mal escrita para dejarla totalmente funcional y, aquellos usuarios que no tengan javascript activado, verán la dirección de correo desactivada, pero lamentablemente, no podrán hacer click sobre ella (aunque yo creo que hoy día ya no quedan usuarios con javascript desactivado en sus navegadores).

LEER ENTRADA

06 de Septiembre de 2011 3,113 veces Ver comentarios

Otro año más he tenido el gusto de asistir a una nueva edición de Subflash, desde mi humilde punto de vista, el mejor evento que existe, donde se comparte en un fin de semana, conocimientos, amistad, risas, compañerismo, regalos y muchos momentos para recordar el resto de tu vida.

Pero vamos por partes, porque cada uno de los puntos merece su párrafo, empezando siempre por el debido agradecimiento a toda la gente de [Q] Interactiva, Marcos, Armando, Jorge, Berto, a Quadricula a través de Ramon y todos aquellos que me olvido que participan en la organización del evento.

LEER ENTRADA

26 de Agosto de 2011 19,134 veces Ver comentarios

Este tutorial me lo ha pedido Diana desde Facebook y básicamente se trata de animar un botón con efecto fade al pasar el ratón por encima utilizando, desde ya, jQuery para la animación.

Lo que necesitamos para empezar es una imagen tal como se ve en la foto aquí arriba, donde estarán todos los botones en fila con el estado normal y en la fila de abajo, todos los botones con el efecto final. El efecto a realizar será el que ves arriba de todo en mi web, en los iconos de las redes sociales.

LEER ENTRADA

24 de Agosto de 2011 4,405 veces Ver comentarios

Su título lo dice todo. Maqueta tu contenido en columnas con este más que interesante plugin para jQuery. Puedes indicar el ancho y cantidad de las columnas a mostrar y, lo mejor de todo, personalizarlas mediante css utilizando unos selectores personalizados para cada columna.

Creo que no hace falta decir nada más. Mírate la demo que publica su autor en su web, junto a muchos otros ejemplos...

LEER ENTRADA

23 de Agosto de 2011 7,036 veces Ver comentarios

Este plugin es una alternativa al ya conocido ScrollTo, que lo que hace es que al presionar sobre una de las opciones de un menú con enlaces internos, éste desplace la página (o haga scroll) hasta el div correspondiente con una animación.

Además, tiene como ventaja, un peso muy reducido y varias opciones personalizables. Aun no lo he probado, pero desde ya no me gusta que muestre un mensaje que pone "Scrolling" a la derecha de la pantalla, pero imagino que se podrá configurar.

LEER ENTRADA

12 de Julio de 2011 4,945 veces Ver comentarios

Este pequeño trozo de código en jQuery sirve para calcular la distancia entre el cursor del ratón y el centro de un elemento que debemos definir dentro de nuestro código.

Puede ser muy útil para activar cierta función cuando el ratón está en determinada posición o a cierta distancia de algún elemento de nuestra web.

LEER ENTRADA

11 de Julio de 2011 5,907 veces Ver comentarios

Este plugin de jquery se encarga de cortar largas cadenas de texto para mostrar un ver más o ver menos al final del texto. Cortará el párrafo según la cantidad de palabras que especifiquemos y agregará automáticamente un botón para expandir el contenido. Una vez expandido, cambiará ese botón por otro para volver a contraer el texto a su formato original.

Realmente no tiene mucha explicación y no es difícil de aplicar. Es lo que estoy usando aquí abajo, en las palabras claves de este artículo, donde se irán agregando todos aquellos criterios de búsqueda por los que la gente encuentra este artículo. Una vez que pase la cantidad de palabras especificadas, el plugin, lo cortará y mostrará un ver más al final para expandir ese div y ver todas las palabras claves.

LEER ENTRADA

01 de Julio de 2011 5,403 veces Ver comentarios

Hace mucho que existe esta versión del famoso lightbox pero en versión jQuery. Este plugin es muy limitado hoy día ya que solo vale para imágenes, pero si lo que quieres es ampliar tus fotos con un código muy pero muy liviano, debes darle una oportunidad.

No tiene mucho que hacer contra otros como Colorbox o PrettyPhoto o FancyBox, pero si tu objetivo son solo ampliar las imágenes, te vale de sobra.

LEER ENTRADA

03 de Junio de 2011 3,545 veces Ver comentarios

No es una novedad que Google sacó un botón social para que los usuarios voten los contenidos de las webs o blogs que visitan. Esto servirá para que tus amigos (según Google), obtengan recomendaciones de webs que pueden interesarte.

Hablando mal, hoy día, si Google se tira un pedo, se huele en el mundo entero y a velocidad luz. Está claro que cada anuncio que hace la empresa de las oo, mueven todo twitter y cuanta red social se haga eco.

LEER ENTRADA

30 de Mayo de 2011 6,076 veces Ver comentarios

Este pequeño código sirve para mostrar filtros por categorías sobre el contenido mostrado en pantalla. Es decir, si tienes, por ejemplo, un portfolio de trabajos y quieres que el usuario pueda filtrar por categorías, este código te ayudará a hacerlo.

El proceso es muy sencillo, debes mostrar tu contenido en el formato que quieras, pero separando ya sea en un div, un tr, un li o lo que quieras cada uno de ellos, porque deberás asignarle como class, el título de la categoría a la que pertenece (que puede ser una o varias).

LEER ENTRADA

19 de Mayo de 2011 9,742 veces Ver comentarios

A pedido de un usuario de mi web y viendo que el plugin de jQuery Externalify no funciona (o yo soy muy tonto y no lo puedo hacer funcionar), les dejo una pequeñísima función que hará lo que necesitan sin plugins.

Sólo necesitan la librería jQuery (cualquier versión instalada en el head de tu web. Y ahi va...

LEER ENTRADA

18 de Mayo de 2011 4,071 veces Ver comentarios

Pues es así. No todo vale para generar tráfico a tu web. Cada vez, veo con más frecuencia como aparecen artículos en blogs que son copias fieles de los originales y que no se menciona, siquiera, la fuente original.

No todo vale para posicionar tu web. No vale aprovecharte del título o post de otra persona. No vale duplicar el contenido de otros blogs famosos, y si el dios Google se entera, no pasará mucho tiempo hasta que te penalicen.

LEER ENTRADA

06 de Mayo de 2011 8,803 veces Ver comentarios

El siguiente es un ejemplo de como puedes utilizar un sistema de autenticación de usuarios mediante su cuenta de Twitter. Realmente no le veo mucha utilidad en sistemas con registros de usuarios pero sí para comentarios u otros sistemas que no necesiten más datos de los que puede facilitarte twitter.

Todo comienza con una serie de pasos que detallo a continuación. Donde la clave de todo es crear una aplicación en Twitter que hará de lanzadera, obtener unas key del centro de developers de twitter y utilizar alguna de las librerías que Twitter mismo te ofrece.

LEER ENTRADA

05 de Mayo de 2011 9,206 veces Ver comentarios

Breve explicación de como montar un menú multinivel con distintas animaciones con jQuery. Si buscas montar un menú multinivel (o multilevel in english) con 2 líneas de código... esta es tu solución.

Realmente es tan fácil de hacer que la web de su creador no tiene ni explicación más que 2 trozos de código de como implementarlo... así que no te quejarás de su facilidad de uso.

LEER ENTRADA