soy Martín Iglesias diseñador web freelance de A Coruña, especializado en maquetación css adaptativa y desarrollo de páginas web a medida.

Quien me conoce, sabe que soy muy fan de jQuery y la manera en que simplificó el uso de javascript a la vez que aportó grandes funcionalidades y efectos simples y complejos con, muchas veces, pocas líneas de código.

Cientos y cientos de nuevos plugins jQuery se publican cada año. Algunos básicos, ofreciendo funciones simples, otros pueden ser complejos y ofrecer muchas más funcionalidades.

De cualquier manera, ambos tipos de plugins son siempre útiles. En esta lista de 30 plugins jQuery, habrá de las 2 clases, algunos complejos y otros realmente simples.

ver más >

Otro año más se viene EL evento del año para los amantes de las webs, los juegos, los pica códigos, los diseñadores, los que quieren pasar un buen rato, las novias o novios de todos estos y todo aquel que quiera ir a conocer gente y volver con muchos amigos nuevos.

Subflash ya tiene fecha, lugar, precio y todo preparado. A falta de la confirmación de los talleres (que los iré actualizando en esta mini entrada a medida que se confirmen), pues este año toca la tierra del buen vino riojano... concretamente Ezcaray, bien llamado, el primer municipio turístico de La Rioja.

Yo, este año, no puedo confirmar con tanto tiempo de antelación mi presencia, está condicionada a una serie de acontecimientos, pero, como siempre, haré lo que pueda para poder estar. Pero si tú puedes, no te lo pierdas, hazme caso. El lunes siguiente, me darás la razón.

ver más >

Volvemos a jQuery y esta vez lo hacemos con un poco de PHP y JSON. Lo que vamos a hacer es rellenar un SELECT (o lista desplegable) con opciones cargadas remotamente mediante JSON.

Para ello, nos vamos a valer de 3 elementos. Un formulario -con un botón para cargar el contenido-, un poco de javascript para hacer la carga de opciones y un PHP que devolverá un array convertido en una cadena JSON.

Tú me dirás, pero a quién se le ocurre cargar las opciones de un select presionando un botón y yo te diré... a nadie, pero la idea es hacer lo que se podría traer automáticamente mediante la interacción de tu click, más que nada, para que veas lo que está pasando.

ver más >

Siguiendo con mis anteriores post donde hablo de jQuery Validate, esta vez me ha tocado verificar que la fecha ingresada en un campo de texto de mi formulario sea correcta.

Qué quiere decir que una fecha sea correcta... pues que exista. jQuery Validate tiene una opción para validar fechas y otra que llama dateISO, pero según mis pruebas, el primer caso (DATE), sólo verifica que ingreses un número (he probado a poner un 33 y el validador ha pasado de largo)... y el segundo, si bien valida el formato de una fecha (dd-mm-yyyy o yyyy-mm-dd) no verifica que la fecha exista, por lo que si pones 33-33-3333 te deja pasar porque el formato es correcto.

Sin más introducciones, nos metemos de lleno a crear un nuevo método de validación. No hay mucho que explicar, en la documentación de jQuery Validate te explica que este potente plugin permite la creación de métodos propios para validar prácticamente todo, así que a eso vamos.

ver más >

Como desarrolladores web, a menudo necesitamos mostrar las fechas en nuestro sitio web. Como usuario, no me gusta leer fechas completos como "26 de noviembre 2011 23:30" porque, inconscientemente, me pongo a hacer la cuenta para saber cuánto tiempo pasó hasta el día de hoy.

Prefiero leer fechas inteligentes como "Hace 1 hora" o "hace 6 meses". Por lo tanto, aquí he escrito una función rápida y sencilla en PHP que muestre la diferencia o tiempo transcurrido basándose en un valor de marca de hora determinado tiempo.

Básicamente definí 2 funciones anteriores:

ver más >

A raíz de una consulta en Twitter de mi buen amigo @tecnorama y de mi nuevo amigo @opeto82, he preparado una minidemo para dejar fijo el cabecero (o el elemento que nos interese) al hacer scroll y no perderlo de vista.

Seguramente habrás visto miles de webs (incluso la mía) que al desplazarte con las barras de desplazamiento vertical, pierdes el logo, el menú o algún elemento que te haría falta tener a mano si el contenido se hace muy extenso.

Pues bien, este pequeño código de 2 líneas aplicará una clase CSS a nuestro elemento si el scroll supera determinados pixels y se la quitará si el scroll vuelve a su estado original.

ver más >

Lo que vamos a hacer en este post es agregar dinámicamente un botón para volver a la parte superior de la web si nuestra página tiene scroll vertical.

Básicamente controlaremos la posición vertical de nuestra página y si ésta supera un tamaño especificado en el código javascript, aparecerá un botón con una flecha apuntando hacia arriba en la parte inferior derecha de nuestra pantalla.

Lo curioso de ésto es que, por una vez, lo haremos sin utilizar ninguna clase de plugin y lo haremos de tal manera que no haga falta escribir el botón en todos los html de nuestra web -aunque en lenguajes dinámicos agregarlo en alguno de los includes que utilices evitaría una línea de javascript-.

ver más >

Si eres de los que usan las tablas para lo que realmente son, es decir, para mostrar datos tabulares y no para maquetación, este plugin te vendrá bien si tus tablas contienen muchas filas y corres el riesgo de perder los cabeceros de las columnas al hacer scroll.

Si usas Excel, sabrás que puedes fijar el contenido de las cabeceras para mantenerlas siempre visibles en la parte superior y así saber siempre qué columna estás viendo. Pues bien, este plugin hace lo mismo pero en una tabla de HTML.

Quien me conoce sabe que odio las tablas y la maquetación con ellas, pero hay que reconocer que cuando el contenido debe ir en forma de tabla, es absolutamente correcto utilizarlas y no simular su apariencia a base de divs o listas desordenadas.

ver más >

FractionSlider es un slider más en jQuery, como tantos otros que hay por ahí conocidos tales como el NivoSlider (uno de mis preferidos), el Galleria, etc... pero tiene una particularidad que lo hace diferente y es que cada slide puede tener sus propias animaciones, transiciones y efectos.

Es así, cada uno de los slides puede contener diferentes partes y configurar el orden de aparición, efecto y animación junto al tiempo de duración.

Aunque alertan de algún bug en IE, su autor dice que no ha podido reproducirlos y promete, en la nueva versión publicada, que es slider ya es responsive.

ver más >

Una ventana modal es una ventana secundaria que requiere que los usuarios interactúen con ella antes de que puedan seguir utilizando la aplicación principal. Las ventanas modales son uno de los elementos de la interfaz de usuario más comúnmente usados, y se utilizan, entre otras cosas, para comunicar información importante, o para alertar de error o advertencia.

Zebra_Dialog es un plugin de jQuery pequeño y compacto (un archivo Javascript, sin dependencias distintas de jQuery 1.4.1+) y altamente configurable para la creación de cuadros de diálogo modales, su intención es la de reemplazar el ALERT y CONFIRM nativos de Javascript además de brindar muchas más opciones como abrir páginas en modo iframe, carga de contenido vía ajax, etc...

También se puede utilizar como un widget de notificación (cuando se configura para mostrar sin botones y cerrar de forma automática) para las actualizaciones o errores, sin distraer a los usuarios de su experiencia de navegación por mostrar alertas molestas.

ver más >