# Un ‘antes y después’ creativo y fácil de hacer para tu web

Hay formas muy creativas de darle color, vida e interactividad a los sitios web. Sea un blog, web de noticias, algo personal, cultural, profesional o una [tienda ecommerce online](https://lazcano.com.ar/e-commerce/), algún trabajo de marketing o simplemente diversión; cuando quieres representar un ‘_antes y después_‘ lo mejor es hacer una transición.

Ahora, si además es interactivo y permite al usuario manipularla, jugar con ella, ¡mejor!

<iframe class="juxtapose" width="100%" height="360" src="https://cdn.knightlab.com/libs/juxtapose/latest/embed/index.html?uid=73ce205e-e930-11ec-b5bb-6595d9b17862"></iframe>

Juxtapose: armar transiciones de antes y después interactivas
-------------------------------------------------------------

Tienes [una forma fácil de armar una transición](https://juxtapose.knightlab.com/#make) igual a la de arriba, colocando la url de dos imágenes y configurando en pocos click el código para embeber en WordPress o cualquier otro sitio web (en definitiva, es un iFrame html), o también puedes usarlo para desarrollo y tomar [la librería en cuestión desde Github](https://github.com/NUKnightLab/juxtapose).

### Ejemplos de _Juxtapose JS_ para hacer transiciones interactivas entre dos fotos:

Puedes hacer comparaciones entre dos versiones de productos, por ejemplo, también mostrar los ingredientes crudos y luego el plato listo de una receta y más. Es muy buen efecto para comparar el paso del tiempo, paisajes modificados, avance de obras, cambios corporales en medicina, y cualquier otro uso creativo que quieras darle.

![](https://cdn.hashnode.com/res/hashnode/image/upload/v1724735537338/f7be7d29-ef6b-4f45-be71-aef7fa699acb.png)Transición de fotografía post-guerra y actualidad, año 1945 y 2015.![](https://cdn.hashnode.com/res/hashnode/image/upload/v1724735538869/dd41befa-2173-4d0d-aebf-fae52c7fd4da.png)Transición de fotos fácil: deportista en sus inicios, de joven, y profesional consagrado.
