Antes y Después con jQuery

La implementación de este script es sencilla, sólo necesitas jQuery, el script Before/After, y las dos imágenes que vayamos a comparar.

Primero que nada descarga este archivo, descomprímelo y súbelo a un hosting.
Luego entra en Diseño | Edición de HTML y antes de </head> pega lo siguiente:

<script src='https://ajax.googleapis.com/ajax/libs/jquery/1.5.1/jquery.min.js' type='text/javascript'/>
<script src='http://ajax.googleapis.com/ajax/libs/jqueryui/1.8.5/jquery-ui.min.js' type='text/javascript'/>
<script src='URL del archivo' type='text/javascript'/>
<script type='text/javascript'>
$(function(){
$(&#39;#antesydespues1&#39;).beforeAfter({showFullLinks : true});
});
</script>

Cambia donde se indica la URL del archivo que subiste previamente.
Ahora en una entrada o en un elemento HTML/Javascript pega este código:

<div id='antesydespues1'>
<div><img alt='before' src='URL de la imagen UNO' width='500' height='291'/></div>
<div><img alt='after' src='URL de la imagen DOS' width='500' height='291'/></div>
</div>

Agrega la URL de la imagen UNO que es la imagen del Antes, y la URL de la imagen DOS que es la imagen del Después.

Es importante que tenga especificado el ancho y alto (width y height) de cada imagen para que pueda funcionar en todos los navegadores.
Si deseas agregar más imágenes sólo cambia el ID del contenedor, en este caso el contenedor se llama antesydespues1 así que si agregas otro cambialo por antesydespues2 y así sucesivamente, aunque puedes elegir cualquier nombre siempre y cuando todos sean distintos.
Y en el primer código que pegamos agrega otra línea como esta en color azul:

<script src='https://ajax.googleapis.com/ajax/libs/jquery/1.5.1/jquery.min.js' type='text/javascript'/>
<script src='http://ajax.googleapis.com/ajax/libs/jqueryui/1.8.5/jquery-ui.min.js' type='text/javascript'/>
<script src='URL del archivo' type='text/javascript'/>
<script type='text/javascript'>
$(function(){
$(&#39;#antesydespues1&#39;).beforeAfter({showFullLinks : true});
$(&#39;#antesydespues2&#39;).beforeAfter({showFullLinks : true});
});
</script>

Autor | Catch my fame