点击图片查看大图，让大图居中显示

点击图片查看大图，让大图居中显示
需求：因为图片大小不一，有的图片比较长，一般的居中方法会使大图被截掉

html部分

<div class="isImg">
	<img src="https://avatar.csdn.net/5/F/2/3_weixin_39228870.jpg"/>
</div>
<div class="bg hide"></div>
<div class="bigPhoto">
	<img alt="" src="">
</div>

css部分

.isImg { width:100px;height:100px;}
.isImg img { width:100%; }
.bg { width:100%;height:100%;background-color: rgba(0,0,0,0.3);position: fixed;top:0;left:0;}
.bigPhoto { width:100%;position: fixed;left:0;z-index:1001;}
.bigPhoto img { width:100%;}

js部分

// 点击缩略图查看大图
$(".isImg").click(function(){
	var img = $(this).find("img").attr("src");
	$(".bg").show();
	$(".bigPhoto img").attr("src",img);
	// 如果大图高于手机高度，则bigPhoto的css要改动
	$(".bigPhoto").css({"display":"block","z-index":"99"});
    var winHeight = $(window).height();
    var imgHeight = $(".bigPhoto img").height();
    if(imgHeight > winHeight){
	   $(".bigPhoto").css({"height":"100%","top":"0","overflow":"scroll","transform":"none"});
	   $(".bigPhoto img").css({"margin":"auto"});
	}else{
	   $(".bigPhoto").css({"height":"auto","top":"50%","overflow":"auto","transform":"translateY(-50%)"});
	   $(".bigPhoto img").css({"margin":"0"});
	 }
});
$(".bg,.bigPhoto").click(function(){
	$(".bg").css({"siaplay":"none","z-index":"0"});
	$(".bigPhoto").hide();
});