var data={"Images/small.jpg":["Images/big.jpg"]};//Key:Value
$(function(){
$.each(data,function(key,value){
$("div").last().hide();//初始化最后一层隐藏
var smallPath=$("<img src='" + key + "'/>").css("margin", "5px").css("padding", "2px").css("border", "1px solid #000");//ket是小图的地址;
bigImgPath=smallPath.attr("bigMapPath",value[0]);
bigImgName=smallPath.attr("bigMapName",value[1]);//设置大图地址名称
//给小图添加事件
smallPath.mouseover(function(){
$("div").last.fadeIn("show");//最后一个div淡入效果
$("#show").attr("src",$(this).attr("bigMapPath"));//获取大图地址
//获取大图名称并设置样式
$("#imgTitle").text($(this).attr("bigMapName")).css("background", "#ebf1de").css("padding", "10px").css("margin-bottom", "10px");
});
smallPath.mouseout(function () {
                    //指定最后一个div;
                    $("div").last().fadeOut("slow");
                });
                //.first方法,指第第一个DIV添加小图;(过滤器)
                $("div").first().append(smallPath);
});
});html:
<body>
    <form id="form1" runat="server">
        <div class="column">
        </div>
        <div class="column">
            <p id="imgTitle">
            </p>
            <img id="show" src="" alt="" />
        </div>
    </form>
</body>