javascript

En una prueba super relámpago que le he hecho, me ha parecido lo suficientemente interesante como para comentároslo un poco aquí. Y es que Carlos a veces me escribe para mandarme cosas (y no sólo para pedir xD).

Bromas aparte, Drawter viene a ser un nuevo “experimento” que creo pretende acercar a esos a los que el tema de los “divs y las cajitas” nos puede sonar a chino mandarín. Aunque cada vez es más raro encontrar a un diseñador al que no le suene mínimamente lo del diseño web, seguro que aún queda alguno que agradece que se pueda componer código de una manera, digamos, más visual. Tu coges, te haces tu estructura a gusto del consumidor y luego te generas el código. Vale, no es que sea la flexibilidad personificada pero te sirve para ir empezando a juguetear con estas cosas.

No sé realmente si este tipo de inventos llegan a funcionar realmente o terminan desviándote de lo principal (entender lo que haces). Prefiero abrirme el Coda o el Dreamweaver y darle a las teclas hasta que salga algo como lo que busco. De momento he salido al paso :)

Resumiendo, dedícale al menos un par de minutos. Quizá te parezca lo suficientemente útil como para guardártelo para más adelante. O no.

:: Drawter [en] ::

Hasta hace escasas fechas, he venido usando este qTip para estilizar ligeramente los atributos title de la web. Pero como soy culo inquieto me dió por buscar en Google y resulta que hay una versión para jQuery…y la he tenido que probar. Curiosamente los creadores de ambos sistemas se llaman igual.

En términos comparativos la de jQuery “pesa” bastante más pero también ofrece muchas más opciones de configuración tanto a nivel estético como funcional. Basta echarle un ojo a las demos disponibles [en] para entender lo que digo.

Por tanto, si estás buscando un añadido tooltip para tu proyecto, piensa que quizá este qTip te venga bien.

:: qTip tooltip con jQuery [en] ::

En ocasiones contadas llego hasta alguna web que tiene implementado algún complemento o sistema de mostrar información que me llama la atención. Lo que hago entonces es tan simple como bucear en el código fuente a ver si es algo propio y desarrollado exclusivamente para el site en cuestión o si por el contrario es alguna cosilla que se puede encontrar y emplear como uno quiera.

Lo último que me encontré y que he implementado parece haberos gustado a unos cuantos a tenor de los comentarios y correos que me han llegado. Como ayer me llegó otro más, pensé que lo mejor era deciros cómo hago eso de que las imágenes carguen a medida que nos desplazamos con el scroll.

Es tan sencillo como usar jQuery y Lazy Load [en].

No creo que tenga que ponerme a explicar cómo “enchufarlo”. Si tienes un mínimo (pero mínimo mínimo) conocimiento de hacer llamadas a javascript te bastará para hacerlo funcionar.

En cualquier caso también hay un plugin para Wordpress [en] que no he probado y que en teoría debería facilitar la tarea (que, repito, es bastante sencilla ya de por sí).

Ojito al tema compatibilidad con otros plugins de jQuery puesto que Lazy Load no funciona bien con la última versión de la librería. Y recordad que para agilizar peticiones al servidor, siempre podréis cargarlo externamente (desde Google mejor)

El otro día me estaba peleando con Lazy Load [en] y llegué de rebote a un buen artículo donde enumeran unas cuantas técnicas relativas al buen uso de jQuery.

A mí se me escapan muchas de ellas pues como ya he dicho en numerosas ocasiones, sólo lo empleo para hacer algunos apaños. Pero como sé que alguno por aquí le da bastante al javascript, quizá alguno de los puntos tratados, le vengan bien. Bon profit!

:: Improve your jQuery 25 excellent tips [en] ::

Uno de mis jefazos dejaba el otro día en [Q]blog una interesante página que nos permite comparar las diferentes compatibilidades que ofrecen los navegadores actuales frente a características propias de HTML5 o CSS3 por citar un par.

Es bastante configurable a la hora de mostrar según qué datos sobre los navegadores que queramos. Y tiene pinta que el autor quiere mantenerla actualizada regularmente. Ale, a favoritos!

:: Tabla comparativa de navegadores con soporte HTML5, CSS3, SVG… ::

No sé si recordaréis Glimmer, ese intento de aplicación de escritorio destinada a hacernos la vida un poco más fácil a los “pezuñeros” (esos que de código sabemos 4 cosas pero toqueteamos igualmente). Entiendo que IxEdit está enfocada también para los de esta especie puesto que pretende ayudar a la creación de interacciones y efectos mediante un sencillo editor. Está claro que igualmente hace falta un mínimo conocimiento de lo que se está haciendo pero al menos la tarea se hace algo menos tediosa de esta forma.

Es multiplataforma, gratuito y tiene bastante información en la web oficial. Por probarlo no pasa nada.

:: IxEdit [en] :: (Vía Ceslava + PixelGangster [en])

Como no todos somos unos máster del Universo con jQuery seguro que a más de uno nos vendrán muy bien estos videotutoriales jQuery para principiantes que abarcan desde el empleo de efectos básicos y la carga de la librería, hasta cosas más complejas usando selectores avanzados o creando nuestros propios switchers y tooltips.

Para ser gratis, no está pero que nada mal. Están en inglés pero bueno, son vídeos ¿no? :)

:: videotutoriales jQuery para principiantes :: (Vía [Q])

¿Conoces ya Snipplr? ¿Y DevSnippets? Pues para que tú también hagas triplete apúntate Snipt como otro de esos sitios super interesantes en los que hay un buen montón de porciones de código que usamos de manera frecuente y que nunca está de más tener a mano. Las gracias al jefe [Q] que fue quien lo descubrió.

:: Snipt [en] ::

En Webmaster libre me he encontrado una pequeña aplicación que seguro que hace las delicias a más de uno.

Se trata de Glimmer, una aplicación de escritorio que te permite crearte menús, efectos de paso de imágenes y tooltips sin sudar la gota gorda con jQuery. Porque a muchos el tema de meter la zarpa en el código o bien no nos gusta o no terminanos de pillarle el truco, este programita viene como anillo al dedo.

Lo verdaderamente interesante es que tiene un modo más avanzado para crear tus propios scripts. Bastaría con editar el HTML con el que estés trabajando haciendo uso de Glimmer para asignar eventos y efectos.

Esto último no lo he probado en profundidad y realmente aunque soy algo torpe, me gusta meterme directamente con el código. Pero eso no quita que Glimmer tenga buena pinta y pueda ser una buena opción para alguno de vosotros.

:: Glimmer [en] ::

DevSnippets es una página que tiene relativamente poca vida y que guardar junto a otras imprescindibles como Devkick o Snipplr pues se trata de un buen lugar donde encontrar recursos y técnicas ya sean para diseño o programación web.

Truquitos CSS, formularios y efectos con javascript, un poquito de todo…

:: DevSnippets [en] ::