En el proyecto que estoy realizando para el trabajo necesitaba un plugin sencillo que me permitiese lanzar alertas y mensajes con la posibilidad de obtener la respuesta del usuario para realizar una acción en particular.
Hay varios plugins jQuery por ahí que permiten esta funcionalidad, pero decidí desarrollar uno nuevo para aplicar las opciones que más me interesaban y aplicarle un estilo visual personalmente más atractivo y limpio que las soluciones actuales. El plugin que he desarrollado se llama Messi.
Messi (por message, por por el jugador del Barça) permite de un modo sencillo generar un mensaje visual en la página en el que podremos incluir una alerta, un mensaje html (incluso el resultado de una petición ajax) o una imagen.
Con las diferentes opciones de configuración podremos especificar los botones que se deben incluir y asignar un valor a cada uno que se enviará a la función callback que especifique el usuario. Tenemos flexibilidad para indicar si el mensaje lleva un título, si el mensaje se muestra en una “ventana” modal o la posición del mismo.
Además he incluido funciones rápidas para lanzar de forma sencilla un mensaje de alerta (Messi.alert()), una pregunta (Messi.ask()), una petición ajax (Messi.load()) o una imagen (Messi.img()).
Para no tener que usar una extensión en el navegador he creado este marcador que abre una ventana flotante y permite publicar la página que se está visitando directamente en Google Buzz.
Arrastrar este enlace a la barra de marcadores: Buzz
Hoy me he interesado por cómo se desarrollaban las extensiones para el navegador Google Chrome y al final he acabado publicando la primera…
La extensión es para mi blog dolcebita. Con esta extensión instalada podrás visualizar rápidamente las entradas más recientes del blog sin necesidad de salir de la página en la que te encuentres. Al pulsar el icono de dolcebita se mostrará un ventana flotante en la que te aparecerán los artículos más recientes del blog.
Podrás ver una pequeña descripción del contenido del artículo y tendrás opción de compartirlo con tus amigos a través de los botones de envío a Twitter, Facebook y Google Buzz.
En la parte inferior dispones de las diferentes secciones que tenemos para ver las últimas entradas de cada una de ellas y además se ha habilitado un buscador en la esquina superior derecha para realizar consultas sobre un determinado término: iphone, google, apple, microsoft…
El desarrollo de extensiones normalitas para Chrome no es muy complicado para un desarrollador web. Están realizadas utilizando HTML y JavaScript, y siguiendo los pasos del tutorial es sencillo crear extensiones como esta.
Echad un vistazo a Spritely, un plugin para jQuery que permite aplicar efectos a elementos y fondos para crear animaciones sin necesidad de flash, solo con HTML y Javascript. Se ha desarrollado para que pese lo menos posible y funcione perfectamente también en dispositivos móviles.
En Future Colors ha realizado una chuleta con la documentación de la API del nuevo jQuery 1.4.
Lo bueno de esta chuleta (o cheat sheet) es que además de tenerla en versiones en PDF y PNG para imprimir, hay una versión web que te permite acceder a la documentación de cada una de las funciones.
#grid es una pequeña herramienta que te ayudará a la hora de realizar la maquetación de tus webs. Usando JavaScript y CSS el grid se puede activar u ocultar dinámicamente con una combinación de teclas:
El nuevo proyecto de James Hall es jsPDF, una librería en javascript para generar dinámicamente archivos PDF.
El script genera una URL para que el navegador (de momento solo soportados Safari, Opera o Firefox 3.5 Beta) abra el documento para visualizarlo. El ejemplo de arriba se contruye con el siguiente código:
Drew Wilson es un desarrollador web que está proponiendo el uso de un nuevo atributo que él denominó fullsize en los elementos IMG del código HTML.
Como todo el mundo puede comprobar el uso de librerías similares a lightbox que son usadas para visualizar un tamaño mayor de una imagen se ha extendido mucho por la web y es dificil no encontrar un sitio con una galería de fotos que no lo tenga implementado. Básicamente este atributo contendría una versión de mayor tamaño (peso, dimensiones) de la imágen que se asigna en el atributo src, para que los propios navegadores web incluyan nativamente la forma de gestionar esas imágenes.
Mediante la creación de un grupo en Google, Drew intenta recoger todas las sugerencias del resto de los usuarios y hacer fuerza para que el W3C tenga en cuenta esta consideración.
Mientras tanto, nos propone usar ya este atributo en nuestros proyecto y, mediante el uso de plugins para los frameworks más conocidos de javascript, dotarlo de funcionalidad.
Desde su web podeis votar para uniros a la propuesta.
Debido a motivos de trabajo últimamente le he dedicado muchas horas al desarrollo en javascript, especialmente usando la librería jQuery.
En determinados momentos me han saltado dudas y preguntas de como realizar determinado proceso y tenía que recurrir a la documentación oficial de la librería y a blogs que hablaran algo del tema.
Para ir recopilando esa información en un único lugar y así poder ayudar a resolver las dudas de otros programadores me he creado un blog alojado bajo WordPress.com relacionado exclusivamente con el mundo jQuery.
Todo jQuery es un blog donde encontrarás noticias, tutoriales, ejemplos, documentación y plugins para sacarle más partido a la librería, servir de fuente de inspiración y mejorar en tus desarrollos.
El blog está abierto a las dudas de los usuarios, en la sección de contacto encontrareis las formas para enviar vuestros problemas y/o sugerencias.
Si os gusta el desarrollo web os espero en el blog y en su usuario de twitter: @todojquery
Si os gusta el desarrollo web seguro que conoceis el framework de javascript jQuery. Personalmente yo comencé mis primeros desarrollos usando otros frameworks disponibles (sobre todo mootools) pero debido a la popularidad de jQuery y su integración en sistemas como WordPress o Drupal he tenido que adaptarme a esta biblioteca.
A pesar de que jQuery tiene una muy buena documentación comparado con otros proyectos, en su momento eché en falta la información sobre como desarrollar un plugin básico para jQuery explicado de forma sencilla. Así que he desarrollado un pequeño plugin a modo de ejemplo para intentar solucionar las dudas iniciales que podais tener. Para ello vamos a programar un flip clock: