/*
     * 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/easiest-tooltip-and-image-preview-using-jquery
     *
     */

    this.imagePreview = function(element,xOffsetVal,yOffsetVal){
        /* CONFIG */

        xOffset = 100;
        yOffset = 30;
        if (xOffsetVal!=null) xOffset=xOffsetVal;
        if (yOffsetVal!=null) yOffset=yOffsetVal;

        // these 2 variable determine popup's distance from the cursor
        // you might want to adjust to get the right result

        /* END CONFIG */
        $(element).hover(function(e){
            this.t = this.title;
            this.title = "";
            var c = (this.t != "") ? "<br/>" + this.t : "";
            var src = (this.value === undefined) ? this.rel : this.value;
            $("body").append("<p id='preview'><img src='"+ src +"' alt='Image preview' />"+ c +"</p>");
            //xOffset=$("#preview").height()/2;
            $("#preview")
            .css("top",(e.pageY - xOffset) + "px")
            .css("left",(e.pageX + yOffset) + "px")
            .fadeIn("slow");
        },
        function(){
            this.title = this.t;
            $("#preview").remove();
        });
        $(element).mousemove(function(e){
            $("#preview")
            .css("top",(e.pageY - xOffset) + "px")
            .css("left",(e.pageX + yOffset) + "px");
        });
    };

    /* End Image preview script */