Imagine "Inainte si Dupa" cu jQuiery

---

Dacă ai un blog de design, machiaj, sau dacă utilizezi fotografii comparative sa fi sigur că acest script este foarte utilidad.Poti vedea o imagine cum arata "inainte / dupa", este un script care funcţionează cu jQuery şi afişează dinamic două imagini simultan prin comparare. Pe cele doua imagini de mai jos apare o bara verticala cu ajutorul ei se poate schimba o imagine cu alta.

http://www.blogger.com/img/blank.gif

Pentru adaugare acestui efect mergi la Desing --> Editare HTML si exact inaintea liniei </head> adauga urmatorul cod:

<script src='http://ajax.googleapis.com/ajax/libs/jqueryui/1.8.5/jquery-ui.min.js' type='text/javascript'/>
<script src='http://dl.dropbox.com/u/3521870/jquery.beforeafter.min.js' type='text/javascript'/>
<script type='text/javascript'>
$(function(){
$(&#39;#antesydespues1&#39;).beforeAfter({showFullLinks : false});
$(&#39;#antesydespues2&#39;).beforeAfter({showFullLinks : false});
});
</script>

Salveaza modificarile, acum mergi la o postare noua unde adaugi codul de mai jos.

<div id='antesydespues1'>
<div><img alt='before' src='URL_imagine UNU' width='500' height='291'/></div>
<div><img alt='after' src='URL_imagine DOI' width='500' height='291'/></div>
</div>

Schimba URL_imagine UNU si URL_imagine DOI cu url-ul imaginilor ce doresi sa apara.