图片预览所遇到的获取图片尺寸问题

这两天在做图片预览的效果，显示在文字内部的时候限制max-width，显示在遮幕上的时候希望显示原尺寸，这就遇到了问题，如果直接获取当前图片的width，获取的并不是原始的大小，而是设置的max-width，那么如何让解决呢？

需要先var img = new Image()，然后给这个img的src赋值，之后就可以获取到当前图片的原始大小了，然后在各浏览器测试都是成功的（chrome，Firefox，IE9，QQ，UC，Opera，360兼容模式），唯有360的极速模式不可以。

当时特别费解，360的极速模式是chrome内核啊，为什么在chrome可以，在极速模式却不可以。

百度后知道，有可能是网络延迟原因，需要优化代码，代码如下：

function ShowImg(oCtl){
			var img = new Image();
			img.src =$(oCtl).attr("src") ;
			var w = 0,h = 0;
			
			if(window.ActiveXObject) {//IE使用onreadystatechange监听readyState为 loaded或complete时再获取
			   img.onreadystatechange = function() {
				  if(img.readyState == "loaded" || img.readyState == "complete") {
					img.onreadystatechange = null;
					w = img.width;
					h = img.height;
					ShowPop(img.src , w, h);
				 }
			  }
			} else {//其它浏览器可使用onload获取
			  img.onload = function() {
				img.onload  = null;
				w = img.width;
				h = img.height;
				ShowPop(img.src , w, h);
			   }
			}
		}

这样，图片的预览就解决了，可是遮罩层显示的时候如果页面很长，有滚动条，这时滚动鼠标，原页面还是可以滚动，尽管可以禁止鼠标滚动时造成的页面滚动，假若用键盘上的上下键也是会造成页面滚动。

解决思路就是，将页面的样式改为overflow:hidden。

这里还有一点可以优化的地方，就是设置为hidden的时候，滚动条不见了，页面宽度比原来多了一个滚动条的宽度，这样展示的时候页面会来回跳动。

优化思路就是加一个右边距，大部分浏览器是17px，这里偷个懒，就直接设置为17px,代码如下：

function ShowPop(src,w,h){
			var ml = -Number(w/2);
			var mt = -Number(h/2);
			$("#popDiv").css("display","block");//弹出层
			$("#popFade").css("display","block");//遮罩层
			$("#popImg").attr("src",src);//弹出层内图片
			$(".pop-content").css("width",w+"px").css("height",h+"px").css("margin-left",ml+"px").css("margin-top",mt+"px");//设置大小且居中显示
			
			document.documentElement.style.cssText = 'overflow:none;overflow:hidden;_overflow:hidden;height:100%;';
			document.body.style.cssText = 'overflow:hidden;overflow:none;_overflow:none;padding:0 17px 0 0;height:100%;';
		}
		function ClosePop(){
			$("#popDiv").css("display","none");
			$("#popFade").css("display","none");
			document.documentElement.style.cssText = 'overflow:auto;+overflow:auto;_overflow:auto;';
			document.body.style.cssText = 'overflow:auto;+overflow:auto;_overflow:auto;padding:0 0px 0 0;';
		}