Recursos del buen maquetador

from MacBookers 2 by Jose

Siempre digo que tengo que escribir un pequeño post con todos los recursos que suelo usar cuando trabajo, soy demasiado vago para meterlos en delicious y muchos los tengo por ahí guardados o listas de correo.

El caso es que pretendo que este espacio me sirva también para tener ordenado todos aquellos tutoriales, demos, prácticas varias o curiosidades con los que me he ido encontrado en estos tiempos, si de paso le sirve a alguien más, mejor que mejor.

Problemas con esquinas redondeadas, sean de la complejidad que sean:

Nifty Corners Cube: Los de toda la vida, los de la abuela, para hacer redondeos más o menos típicos

Shaded Border: Para los que buscan grandes emociones, con fondos degradados y demás historias.

Reemplazo de fuentes

Cufón: Mi nuevo muy mejor amigo, funciona generalmente bien (a veces se pega con otros niños-plugins) , es fácil de implementar y las librerias no ocupan demasiado

Sprites

CSS Sprite Generator: Reconozco que yo soy más de hacerlo a mano, pero una buena herramienta se agradece (no penséis mal leches)

Tooltips

Simpletip: Claro y consiso, para hacer tooltips, sin chorradas.

Beauty Tips: Todo lo contrario al anterio plugin, con todas las opciones y chorraditas varias que se puedan imaginar.

Lightboxs

Shadowbox: Muy chulo, con bastantes opciones

Thickbox: El rey de la selva, básico fundamental en todos mis proyectos

Retícula

Jquery-reticulator: Basada en el reticulator de Ale Muñoz, una creación de Manuel Muñoz, básico para cualquier maquetación que tenga que estar al pixel.

Transparencias en IE6

IE Png Fix: Mi otro mejor amigo, este es el que te salva el culo siempre, especialmente cuando llegan diseños puteantes complejos.

Tablas Ordenadas:

Tablesorter: Salvador para aquellos proyectos llenos de tablas con datos de ordenados de usuarios y demás rollos

Bola extra: Google Buttons Style: Fáciles de implementar y quedan chulísimos en cualquier proyecto

Leia Mais…

ColorBox para jQuery 1.3

via arkaitz@guebs

ColorBox es un plugin para jQuery 1.3 muy ligero (12kb) que permite hacer unos lightbox muy atractivos. Cada dia se utilizan mas los lightbox y son mas los plugins que se crean para ello. Este en especial es muy ligero, personalizable y facil de utilizar.

Estas son unas de sus caracteristicas mas interesantes:

Soporta la utilización de fotos de forma individual o en grupos, Soporta ajax en línea, y contenido iframed.

Diversos Estilos. Apariencia completamente controlada a través de CSS, para que los usuarios puedan dar nuevos estilos a la caja.

EL comportamiento de los ajustes puede ser sobre-escrito, sin alterar el archivo de Javascript ColorBox.

HTML Totalmente discreto, no requiere cambios en los existentes HTML.

Efecto atractivo, con discreto degradado.

Precarga de imágenes de fondo para evitar la inflamación de unstyled.

Ligero: sólo 12kbs de JavaScript.

Escrito en jQuery.

Genera XHTML y CSS válido.

Hay varias demos para poder ver ColorBox en acción: Demo 1, Demo 2, Demo 3 y Demo 4. Por otro lado, para descargar ColorBox acceder al sitio web de los desarrolladores.

Leia Mais…

Animated JavaScript Slideshow

Posted by Michael in JavaScript

This dynamic JavaScript slideshow is feature packed and under 5KB. It is the long awaited update to my previous script here. A few new features include description support, link support, no naming restrictions, portrait image support, graceful degradation and active thumbnail status. This script was built ground-up and will soon be included at scriptiny where all my scripts will be added as they are updated, debugged and incorporated in the new TINY namespace. I will also document the scripts more thoroughly and publish multiple examples. I will continue to publish scripts there and support as I have time via the new community forum. I will try and post more frequently here on a wide range of web development related topics.

Images

imgSpeed = int; (10) navOpacity = int; (25) navHover = int; (70) letterbox = “string”; (#000) required color for letterbox on portrait images link = “string”; class name for link hover state

Auto Slideshow

auto = boolean; (false) speed = int; (10)

Information Dialog

info = boolean; (true) infoID = “string”; required for information dialog infoSpeed = int; (10)

Thumbnail Slider

thumbs = “string”; id of thumbnail slider, disabled if not set scrollSpeed = int; [1-20] (5) thumbOpacity = int; [0-100] (70) active = “string”; required for thumbnail active border spacing = int; (5) spacing between thumbnails left = “string”; id of left navigation link, required for slider right = “string”; id of right navigation link, required for slider

Click here for the demo.

Click here to download the source.

Leia Mais…