利用HTML、CSS实现的图片预览弹出层的教程

}     
.imgLunboItem{     
    width:76px;     
    height:76px;     
    margin-left:10px;     
}    

　　JQ的代码：

复制内容到剪贴板

var ImageScaHandler={     
    ImageMaxWidth:800,     
    ImageMaxHeight:600,     
    ImagePathJson:[{imgName:"预览弹出层测试图片1",imgPath:"1img1.jpg",imgInfo:"HTML图片预览弹出层测试图片-豪车图片集锦(图片均来自互联网)"},     
    {imgName:"预览弹出层测试图片2",imgPath:"1img2.jpg",imgInfo:"HTML图片预览弹出层测试图片-豪车图片集锦(图片均来自互联网)"},     
    {imgName:"预览弹出层测试图片3",imgPath:"1img3.jpg",imgInfo:"HTML图片预览弹出层测试图片-豪车图片集锦(图片均来自互联网)"},     
    {imgName:"预览弹出层测试图片4",imgPath:"1img4.jpg",imgInfo:"HTML图片预览弹出层测试图片-豪车图片集锦(图片均来自互联网)"},     
    {imgName:"预览弹出层测试图片5",imgPath:"1img5.jpg",imgInfo:"HTML图片预览弹出层测试图片-豪车图片集锦(图片均来自互联网)"},     
    {imgName:"预览弹出层测试图片6",imgPath:"1img6.jpg",imgInfo:"HTML图片预览弹出层测试图片-豪车图片集锦(图片均来自互联网)"}     
    ],     
    Init:function(){     
        $("#ImageSca").css("width",ImageScaHandler.ImageMaxWidth 200 "px");     
        $("#ImageSca").css("height",ImageScaHandler.ImageMaxHeight 10 "px");     
        $("#ImageSca").css("top",($(window).height()-$("#ImageSca").height())/2 "px");     
        $("#ImageSca").css("left",($(window).width()-$("#ImageSca").width())/2 "px");     
        $("#ImageContainer").css("width",$("#ImageSca").width()-300 "px").css("height",$("#ImageSca").height());