elWebmaster.com

Desde el sitio Swedish Fika les traigo un tutorial para crear un encabezado al que, al pasar el mouse sobre él, le aparezca un fondo a través de un efecto de desvanecimiento. Para esto se usará XHTML básico, CSS y algo de Javascript no obstrusivo mediante JQuery. El efecto final puedes observarlo aquí.

La imagen que utilizan en el ejemplo puedes verla debajo de este párrafo. Como verás se encuentran tanto la imagen normal como la que aparecerá con el efecto en un mismo archivo. De esta forma nos aseguramos de que cargue más rápidamente. Seguir leyendo

Las Tag Clouds o nubes de tags han invadido la web. Su creciente popularidad se merece una breve guía de recursos, tips, tutoriales y sitios de inspiración.

Para los que no lo saben, las nubes de tags son una representación gráfica de los tags (palabras clave) que son utilizados en un sitio web para describir brevemente el contenido de una determinada página. Las palabras de mayor tamaño representan al contenido más popular de una web. Seguir leyendo

Lo natural en la web parece ser el flujo vertical de los elementos, cuanto más contenido hay en una página, más larga se vuelve la misma. Esto responde a criterios de usabilidad dado que estamos acostumbrados a leer líneas de texto cortas que, una debajo de otra, conforman los párrafos de un texto.

Pero ¿se pueden romper los estándares? La respuesta es: “depende de tu propósito”. Si lo que quieres es distinguirte, tu público tiene el ojo entrenado y el tipo de contenido de tu sitio amerita dinamismo ¡bienvenido sea el scroll horizontal! Entérate cómo conseguirlo y conoce los mejores ejemplos. Seguir leyendo

jQuery in 15 minutes es una fantástica introducción (en inglés) para aquellos que no tengan ni idea de cómo funciona esta fantástica librería que te ayuda a darle mayor dinamismo a tu sitio web por medio de Javascript y AJAX.

Me he tomado el trabajo de incrustar aquí directamente este slideshow Flash para que puedas dar tus primeros pasos con jQuery. Puedes verlo a pantalla completa si prefieres y manejar las diapositivas con el controlador de la parte inferior. ¡Espero que te sirva! Seguir leyendo

El conocido efecto de iGoogle, donde podemos eliminar paneles a nuestro gusto, es algo muy sofisticado que le da mayor control al usuario sobre qué le interesa y qué no de nuestro sitio web, blog o aplicación online, o borrar las noticias que ya ha leido, etc.

Este efecto se logra con un poco de código por medio de jQuery. Así podemos incluirlo en nuestro sitio para volverlo más dinámico y también más efectivo a la hora de hacer sentir cómodos a nuestros usuarios. Entérate cómo hacerlo. Seguir leyendo

¿Quieres lograr buenos encabezados sin usar imágenes de Photoshop? Aquí te mostramos un simple truco de CSS para que sepas cómo crear el efecto de texto con gradiente con una imagen PNG (puro CSS, sin JavaScript o Flash).

Todo lo que necesitas es un tag vacío en el encabezado y aplicarle un overlay a la imagen de fondo usando la propiedad CSS position:absolute. Este truco ha sido testeado en la mayoría de los buscadores: Firefox, Internet Explorer 6, Safari y Opera. Sigue leyendo para saber cómo hacer… Seguir leyendo

En Ajax Rain encontraremos más de 700 ejemplos de scripts orientados a JQuery y HTML dinámico. Ingresando en los que más nos gusten accederemos al sitio oficial donde podremos aprender más, descargar o copiar los scripts para usarlos en nuestros sitios.

Incluye un completo buscador, además de permitirnos acceder directamente a los scripts que más nos interesen por medio de su nube de tags. No se lo pierdan.
Haz clic aquí para entrar en Ajax Rain.

Ya conocemos los beneficios de usar jQuery, sobre todo a la hora de otorgar movimiento e interactividad a nuestros sitios web. Ahora bien, con la ayuda de algunos plugins podemos generar presentaciones de diapositivas, tooltips, validación de formularios, menús de árbol, esquinas redondeadas o manejar varias peticiones AJAX. En el blog de Carlos Leopoldo hay una lista de plugins para hacer todo esto. Sólo recuerden que son para jQuery versión 1.2.1. Seguir leyendo

Hace un par de semanas festejábamos el cumpleaños de jQuery, con la salida de su versión 1.2.2. Pero los que se estén iniciando en el mundo del desarrollo de sitios con animaciones, interactividad y que usan AJAX, tal vez desconozcan esta librería Javascript. Sin duda es una buena alternativa para prototype y mootools, que nos simplificará tareas y optimizará la cantidad de tiempo que pasamos escribiendo código frente al monitor. Seguir leyendo

Para festejar el cumpleaños de jQuery, sale una nueva versión (1.2.2), que soluciona un bug y trae algunas novedades. jQuery es, para los que no estén familiarizados, una librería Javascript rápida y concisa que te simplifica la vida a la hora de trabajar con documentos HTML, manejar eventos, animaciones y agregar interacción Ajax a tus páginas web. Está diseñada para cambiar la forma en que escribes Javascript. Seguir leyendo