Utopian Webdeveloper

Entradas

Mostrando entradas de 2009

Highslide JS

Esta librería la he utilizado para visualizar imágenes (sueltas o agrupadas en una galería); desde mi punto de vista su mayor virtud es que permite utilizar thumbnails para cargar la página más rápido y versiones de buena calidad que son desplegadas al momento en que el usuario hace clic sobre la imagen que le interesa. Además de útil sus efectos la hacen muy vistosa, lo cual evidentemente es un valor agregado. Instalación: Incluir lo siguiente: <link rel="stylesheet" type="text/css" href="/highslide/highslide.css">  Uso: Si se trata de una imagen aislada se debe incluir el archivo highslide.js y utilizar el siguiente código de inicialización*: hs.registerOverlay({ overlayId: 'closebutton', position: 'top right', fade: 2 }); hs.graphicsDir = '/highslide/graphics/'; hs.wrapp...

Rich Text Editor

Hace apenas unos meses mi conocimiento de javascript era prácticamente nulo, pero poco a poco me fui familiarizando por la necesidad de crear interfaces más amigables y llevar a cabo validaciones básicas. Me he topado con muchas librerías hechas con javascript que mejoran de manera notable la experiencia del usuario. Una de ellas es el Rich Text Editor (RTE), que convierte un simple textarea en un campo que permite darle formato al texto. Básicamente, lo que hace es generar dinámicamente código html. NOTA: todos los archivos necesarios (imágenes, script, hoja de estilo, etc.) se encuentran en la página que incluyo al final. Para utilizarlo es necesario incluir la librería richtext.js o richtext_compressed.js en la sección <head> Posteriormente hay que inicializarlo con la siguiente instrucción: initRTE(imagesPath, includesPath, cssFile); Finalmente se coloca el siguiente código JS donde debe aparecer el campo: writeRichText(nombreCampo, textoHtmlDefault, ancho, alto, botones, sól...

Syntax Highlighter

No cabe duda de que uno aprende cosas todos los días. Resulta que Blogger interpreta el código html, así que para poder poner un ejemplo tuve que investigar cómo darle la vuelta a este problema. Hay una manera "chafa" que consiste en reemplazar por "& gt;" (los separo porque si no me aparecen los simbolitos =P) y poner todo dentro de un bloque <code> </code> Este primer método lo encontré el 8 de abril, pero me entró el gusanito de encontrar algo mejor; un mes después di con el SyntaxHighlighter. Este hermoso plugin hecho en javascript no sólo me resolvió este problema, sino que también me va a permitir mostrar código (en muchos lenguajes de programación, no sólo html) de una manera muy amigable. Les debo la explicación de cómo le hice para instalarlo, pero éste es el resultado: Java: public class Prueba() { System.out.println("A poco no está bonito?"); } PHP: $var = "Hola"; echo($var); CSS: BODY { font-size: 12px; colo...

El porqué

Ya tengo un par de añitos de haber empezado a desarrollar aplicaciones Web, y aunque todavía me falta muchísimo por aprender, se podría decir que ya empiezo a tener experiencia en ciertos ámbitos, la cual me gustaría compartir. Cuando se me presenta un problema, en ocasiones lo logro resolver por mi cuenta después de muchas horas, pero las más de las veces encuentro la solución en algún blog o en algún foro; claro, después de haberle dado clic a 50 links y leído decenas de respuestas. Cabe aclarar que también hay casos en los que la respuesta resulta ser una mezcolanza de varias fuentes. Si están leyendo esto, es muy probable que conozcan la sensación de alivio y agradecimiento que le llega a uno al encontrar un tutorial o un tip que logra resolver el bug que estaba a punto de sacarnos canas verdes o una herramienta o librería que lleva a cabo la funcionalidad que nos hubiera llevado días desarrollar (ya no se diga probar...) Así pues mi intención es crear un blog exclusivo de tips, tu...