Salve ragazzi,
sto utilizzando le librerie jquery ui, specialmente le dialog e non riesco a trovare il modo di fare una specie di effetto zoom.
Vi spiego: nel mio sito web sto costruendo una mini-gallery di immagini (thumbnail) e vorrei che quando viene cliccata una foto venga aperta in una dialog su cui vede la foto più grande e con le sue info; per aprirla vorrei che facesse l'effetto zoom partendo dalla posizione assoluta in cui si trova quella foto. Ho provato a mettere un effetto custom "scale" che potrebbe fare al mio caso, però non riesco a modificare l'origine, visto che parte sempre dal centro della pagina mentre vorrei che partisse da dove si trova la foto e mi sto scervellando un bel pezzo

Vi posto il codice qui
codice:
$(document).ready(function() { $("#dialog").dialog({ autoOpen: false, resizable: false, width: 'auto', height: 'auto', modal: true }); $("img#imgClick").click(function(e) { e.preventDefault(); var t=new Image(); var mw=800,mh=800; t.src=$(this).attr("src"); var width=t.width; var height=t.height; var futureWidth=0; if(width>mw) { futureWidth=mw; var prop=mw/width; $("#dialogImg").css("width",mw) .css("height", height*prop); } else { futureWidth=width*prop; var prop=mh/height; $("#dialogImg").css("width",futureWidth) .css("height",mh); } $("#dialog").dialog("option","show",{ effect:"scale", options:{ origin:[$(this).offset().left+200,$(this).offset().top+120], percent:Math.round($(this).css("width")/futureWidth*100)}, speed:250 } ); $("#dialog").dialog("open"); }); });
ho messo l'effetto show dopo per cercare di essere già preparato in futuro quando dovrò applicare questo codice per tutte le immagini