// JavaScript Document
//copyright c by zhangxinxu 2009-10-17 
//http://www.zhangxinxu.com
/*由于大图绑定在href属性中，故一般而言，需使用a标签的href指向大图。仅支持png,gif,jpg,bmp四种格式的图片。用法是：目标.preview();
例如：<a href="xx.jpg">图片</a>
$("a").preview();就可以了
*/
(function($) {
    $.fn.preview = function() {
        var xOffset = 10;
        var yOffset = 10;
        var w = $(window).width();
        var h = $(window).height();
        $(this).each(function() {
            $(this).hover(function(e) {
                //if(/.png$|.gif$|.jpg$|.bmp$/.test($(this).attr("href"))){
                $("body").append("<div id='preview'><div align='center'><img width='314px' height='140px' src='" + $(this).attr('href') + "' /><p>" + $(this).attr('look') + "</p></div></div>");
                //}else{
                //$("body").append("<div id='preview'><div><p>"+$(this).attr('title')+"</p></div></div>");
                //}

                var topY = 0;
                //alert($.type(e.pageY + $('#preview').height()));
                //alert($.type(h));
                //alert((e.pageY + $('#preview').height()) > h);
                if ((e.pageY + $('#preview').height()) > h) {
                    //alert(1);
                    topY = e.pageY - $('#preview').height() - yOffset;
                }
                else {
                    //alert(2);
                    topY = e.pageY - yOffset;
                }
                //alert(topY);
                $("#preview").css({
                    position: "absolute",
                    padding: "2px",
                    border: "1px solid #f3f3f3",
                    backgroundColor: "#ffffff",
                    top: topY + "px",
                    zIndex: 1000
                });
                $("#preview > div").css({
                    padding: "2px",
                    backgroundColor: "white",
                    border: "1px solid #ffffff"
                });
                $("#preview > div > p").css({
                    textAlign: "center",
                    fontSize: "12px",
                    padding: "1px 0 1px",
                    margin: "0"
                });
                if (e.pageX < w / 2) {
                    $("#preview").css({
                        left: e.pageX + xOffset + "px",
                        right: "auto"
                    }).fadeIn("fast");
                } else {
                    $("#preview").css("right", (w - e.pageX + yOffset) + "px").css("left", "auto").fadeIn("fast");
                }
            }, function() {
                $("#preview").remove();
            }).mousemove(function(e) {
                if ((e.pageY + $('#preview').height()) > h) {
                    $("#preview").css("top", (e.pageY - $('#preview').height() - yOffset) + "px")

                } else {
                    $("#preview").css("top", (e.pageY - xOffset) + "px")

                }
                if (e.pageX < w / 2) {
                    $("#preview").css("left", (e.pageX + yOffset) + "px").css("right", "auto");
                } else {
                    $("#preview").css("right", (w - e.pageX + yOffset) + "px").css("left", "auto");
                }
            });
        });
    };
})(jQuery);