Bisogna parametrizzare le tre funzioni.
codice:
[img]img/img01.jpg[/img]
<div class="overlay" id="overlay" style="display:none;"></div>
<div id="piaggio">
<div class="contenuto_box">
[img]img/portfolio_big/piaggio.jpg[/img]
testo</p>
</div>
<p class="chiudi">X</p>
</div>
[img]img/img01.jpg[/img]
<div class="overlay" id="overlay" style="display:none;"></div>
<div id="ennesimo">
<div class="contenuto_box">
[img]img/portfolio_big/piaggio.jpg[/img]
testo</p>
</div>
<p class="chiudi">X</p>
</div>
var activeBox; //per chiudere dall'overlay
$(document).ready(function() {
$(".apri").click(
function(){
var idToOpen=$(this).className().replace('apri ','');
activeBox=idToOpen;
$('#overlay').fadeIn('fast');
$('#'+idToOpen).fadeIn('slow');
});
$(".chiudi").click(
function(){
var idToOpen=$(this).parent().className().replace('apri ','');
$('#overlay').fadeOut('fast');
$('#'+idToOpen) .hide();
});
//chiusura emergenza
$("#overlay").click(
function(){
$(this).fadeOut('fast');
$('#'+activeBox).hide();
})
});
PS: Non sarebbe meglio usare un plugin tipo http://fancyapps.com/fancybox/ ?
Ciao