PHP: Previsualizar imagenes antes de subirlas al servidor

Supongamos que tenemos un formulario para subir archivos, que ése archivo es la imagen de nuestro perfil y que queremos ver como queda antes de subir la imagen y guardar nuestro perfil.

Para realizar esta tarea php no va a ir solo, va a estar acompañado por un javascript y un iframe para que esto resulte. pero es más facil de lo que parece. Mi amigo GON me facilitó este código que fuimos adaptando para nuestro trabajo. Veamos los pasos para este ejemplo:

Tinymce + ajaxfilemanager : Campos de texto enriquecidos para web

Tinymce es el editor de texto enriquecido WYSIWYG que utiliza Wordpress para crear y editar artículos así como para escribir comentarios.

Este completo pero fácil de instalar editor esta desarrollado en javascript y lo que hace es, básicamente, convertir cualquier TextArea de un formulario en un completo editor html.

Lightbox - la galería de imagenes que todos vemos en html.

Se trata de una de las galerías de imagenes más utilizadas en los sitios desarrollados en dhtml.

Si bien no es un nuevo, esta herramienta desarrollada por Lokesh Dhakar, resulta una herramienta hiper-util a la hora de montar una galería de imágenes dinámica y con buena estética sin recurrir al viejo y (hoy un poco vapuleado) flash.

Simplemente basta con poner las carpetas de archivos js en tu server, incluír los .js en la página donde se mostrará la galería y modificar un poco los links de tus imagenes y ya se logra un gran efecto.

Y lo más importante: Al ser de código abierto, puede personalizarse y mejorarse tanto como quieras. Ni hablar de jugar con los estilos libremente, ya que está basado en CSS.

Podes verlo funcionando en ésta demo.

Descarga la versión 2.04 (actual) desde aquí o desde la página de la librería

La instalación son 3 simples pasos que se detallan aquí.