标签：style http io ar color os sp java on
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"><html xmlns="http://www.w3.org/1999/xhtml"><head><meta http-equiv="Content-Type" content="text/html; charset=utf-8" /><title>无标题文档</title><style type="text/css">.close{ width:30px; height:30px; background:url(images/close_3.png) no-repeat 0 0; position:fixed; top:5px; right:30px; _position:absolute; _top:expression(documentElement.scrollTop+5+"px"); cursor:pointer;}.close:hover{ background:url(images/close_3.png) no-repeat -30px 0;}</style> <script type="text/javascript" charset="utf-8" src="js/jquery2.1.1.min.js"></script> <script type="text/javascript"> function imgShow(_this){ var src = _this.attr("src"); $("#bigimg").attr("src", src); $("<img/>").attr("src", src).load(function(){ var windowW = $(window).width(); var windowH = $(window).height(); var realWidth = this.width; var realHeight = this.height; var imgWidth, imgHeight; var scale = 0.8; if(realHeight>windowH*scale) { imgHeight = windowH*scale; imgWidth = imgHeight/realHeight*realWidth; if(imgWidth>windowW*scale) { imgWidth = windowW*scale; } } else if(realWidth>windowW*scale) { imgWidth = windowW*scale; imgHeight = imgWidth/realWidth*realHeight; } else { imgWidth = realWidth; imgHeight = realHeight; } $("#bigimg").css("width",imgWidth); var w = (windowW-imgWidth)/2; var h = (windowH-imgHeight)/2; $("#innerdiv").css({"top":h, "left":w}); $("#outerdiv").fadeIn("fast"); }); } </script></head><body><img src="images/n_2a.jpg" width="100px" height="100px" onclick="imgShow($(this))"/><div id="outerdiv" style="position:fixed;top:0;left:0;background:rgba(0,0,0,0.7);z-index:999;width:100%;height:100%;display:none;"> <a class="close" onclick="$(‘#outerdiv‘).fadeOut(‘fast‘);"></a> <div id="innerdiv" style="position:absolute;"><img id="bigimg" style="border:5px solid #fff;" src="" /></div></div> </body></html>标签：style http io ar color os sp java on
原文地址：http://www.cnblogs.com/chchao/p/4151535.html
