Hace algunos días se entrego el nuevo sitio para Oportunidad Digital “Fotografía”. Desarrollado en HTML + CSS y harto Javascript de la mano de jQuery. Se aplico un sistema de “filtros inteligentes”, que van apareciendo de acuerdo a los resultados que van quedando y agrupandose de acuerdo al mismo parámetro y luego son entregados a la aplicación Flash que controla la aplicación paso a paso.

El slider de productos se forma a través de una respuesta JSON, que se genera en cada clic sobre los botones de avanzar y retroceder, y una vez que cargan, se desliza una mascara para dar el efecto de slide.

También se reprogramo un sistema de ventanas modales “Fancybox” para poder implementar 2 hojas de estilo en la misma ventana modal (para las imagenes del fondo y bordes).

Via twitter me entero que se viene esta web y de paso, dejan un juego para entretenerse un rato. Se trata de la famosa vibora, aquella que teniamos en nuestros 386, 486, celulares, gameboys, tetris, etc.. pero ahora portado a una versión web. Lo interesante, es que mientras jugamos podemos postear nuestros scores dentro de twitter y quedar así en el salón de la fama.

Para entrar al juego pueden acceder por acá.

Los invito a jugar la #vibora gracias a @fabbianz

Sin duda, los archivos JSON han revolucionado la manera de enviar y recibir parametros dentro de nuestras aplicaciones web. No les voy a hablar en detalle sobre la definicion de un JSON, pero si como procesarlos con JQuery.

Lo primero, es descargarse la librería JQuery desde la página oficial (versión minimizada o comprimida). Luego, creamos un script dentro de nuestra pagina, para especificar la funcion que va a buscar un JSON y luego procesarlo. A su vez, crearemos también un archivo llamado archivo.json.

archivo.json
[{"id": "1", "author": "Sin bandera", "song" : "Suelta mi mano"},{"id": "2", "author": "Sin bandera", "song" : "Que lloro"}]

funcion javascript, que puede ir dentro del html, o bien, en un .js

1
2
3
4
5
6
7

function loadJson(){
    $.getJSON('archivo.json', function(data){
           $.each(data, function(i, item){
               alert(item.id);
           });
    }); 
}

Sinceramente, es algo extremadamente fácil, sin embargo, los ejemplos en español son rebuscados o quizás muy extensos y no se logra ver la facilidad que tiene JQuery para procesarlos.