放大镜

$(function(){

    $(".small_box").hover(function(){鼠标移到图片上

        $(this).find(".float_layer").show();找到小黑背景显示出来

        $(".big_box").show(); 大图片同时显示

    },function(){鼠标移出

        $(this).find(".float_layer").hide();小黑背景隐藏

        $(".big_box").hide();大图片隐藏

    })

    $(".small_box").mousemove(function(e){指定的元素中移动

        //鼠标位置

        var x=e.offsetX,y=e.offsetY;

        //小黑框的左上角位置 -100让鼠标永远在小黑框的中间

        var left=x-100,top=y-100;

        if(left<0){

            left=0;

        }

        if(top<0){

            top=0;

        }

        if(left>200){

            left=200;  

        }

        if(top>200){

            top=200;  

        }为了让小黑框不出图片外

        $(this).find(".float_layer").css({

            top:top+"px",

            left:left+"px"

        })

        $(".big_box img").css({

            top:-2*top+"px",

            left:-2*left+"px"

        })

    })

})