Pervasive Smothering

Por fin alguien diseñó un ‘lightbox’ que fuese ‘casi’ compatible con XHTML. ¿Porqué digo ‘casi’? Pues, porque al estar viendo el código fuente, me dio tanto gusto ver que lo que faltaba era dejar de usar el método innerHTML de Javascript, y usar un método más robusto

Litebox es increible. Deben usarlo para creerlo:

Las modificaciones que hice las describí aquí, y puse el código acá…

En resumidas cuentas, para hacer funcionar bien a esta cosa, deben seguir las instrucciones de la página donde lo consiguieron, luego editar los archivos y poner el camino absoluto a las imagenes (http://ejemplo.com/camino/a/la/imagen.gif) en los archivos lightbox.css y litebox-1.0.js. Tengan cuidado si usan WordPress: NO vayan a reemplazar su archivo style.css (en caso que lo suban a su ‘theme directory’; ese archivo no lo necesitan subir.

Si quieren que su archivo funcione de cualquier manera, deben reemplazar la función ’setInnerHTML’ por esta:

// http://www.doknowevil.net/litebox/
setInnerHTML: function(element,content) {
element = $(element);
if(element.hasChildNodes()) {
element.removeChild(element.firstChild);
}
content = document.createTextNode(content);
element.appendChild(content);
}

Y, básicamente eso es todo. También les sugiero usar un espacio en lugar de usar ‘brackets’ para poner su ‘album’… osea, por ejemplo usar el atributo rel=”lightbox album” en lugar de rel=”lightbox[album]“. Hay que hacer eso porque, de lo contrario, su XHTML no es válido… y además las funciones comparan álbumes por nombres idénticos, así que mientras tengas un espacio entre ‘lightbox’, estarás bien.