Salve a tutti ragazzi.. rieccomi con un nuovo problema, di cui non ne sto venendo fuori.
Ho scaricato uno script, che crea un tooltip con una immagine di preview. Tutto bene fino ad adesso. Il problema sorge quando il tooltip "sborda" dalla mia pagina web.
Mi spiego meglio:
ho una pagina piena di fotografie tutte ordinate come fosse una tabella; quando mi posiziono con il cursore su di una fotografia, mi si apre il tooltip con l'anteprima ingrandita dell'immagine sulla destra del cursore. Il problema però è, che quando mi posiziono su una fotografia impostata sulla destra della pagina, il tooltip "sborda" sulla destra, quindi non riesco a vedere l'anteprima. Vorrei che il tooltip delle fotografie sulla destra, mi si aprisse sulla sinistra, in modo tale da vederla.
Posto qui lo script trovto in rete:
codice:
/*
* Image preview script
* powered by jQuery (http://www.jquery.com)
*
* written by Alen Grakalic (http://cssglobe.com)
*
* for more info visit http://cssglobe.com/post/1695/easies...w-using-jquery
*
*/
this.imagePreview = function(){
/* CONFIG */
xOffset = 15;
yOffset = -0;
// these 2 variable determine popup's distance from the cursor
// you might want to adjust to get the right result
/* END CONFIG */
$("a.preview").hover(function(e){
this.t = this.title;
this.title = "";
var c = (this.t != "") ? "
" + this.t : "";
$("body").append("<p id='preview'>[img]"+ this.href +"[/img]"+ c +"</p>");
$("#preview")
.css("top",(e.pageY - xOffset) + "px")
.css("left",(e.pageX + yOffset) + "px")
.fadeIn("slow");
},
function(){
this.title = this.t;
$("#preview").remove();
});
$("a.preview").mousemove(function(e){
$("#preview")
.css("top",(e.pageY - xOffset) + "px")
.css("left",(e.pageX + yOffset) + "px");
});
};
// starting the script on page load
$(document).ready(function(){
imagePreview();
});
Qualcuno saprebbe aiutarmi? grazie mille anticipatamente.
Ivano