imge 点击放大图片

//这个代码可以忽略
if(data.data.exposureImge!="" && data.data.exposureImge!=null){
						var imgurl = '';
						var img = data.data.exposureImge.split(",");
						imgurl += '<div id="mien" class="clearfix">';
					 	for(var i=0;i<img.length;i++){
					 		imgurl += "<img  id='photoimgId"+i+"' src='"+apiManager.exposureStrategy +img[i]+"' width='150px' height='150px'  onclick='openFile(this,photoimgId"+i+")'/>  "
					 	}
					 
					 	$("#commentsImg").html(imgurl);
					 	$('#mien').viewer();
}

//当上面点击那个图片就会给这个地址传那个图片
 function openFile(e,photoimgId){
 	console.log(e);
 	console.log(photoimgId)
            var imgSrc = "";
            imgSrc = $(e).attr("src");
            //id = $(e).attr("id");
            imgSrc = imgSrc.replace(/url\("/,"");//去掉 url("
          
	    var img_show = null; // tips提示
        var img = "<img class='img_msg' src='"+$(this).attr('src')+"' style='width:400px;' />";
            img_show = layer.tips(img, this,{
                tips:[2, 'rgba(41,41,41,.5)']
                ,area: ['430px']
            });
        
        $('img').attr('style','max-width:70px');
}

第二种方法实现点击放大

<link rel="stylesheet" type="text/css" href="../../common/viewer/viewer.min.css" />

<script src="../../common/viewer/viewer-jquery.min.js" type="text/javascript" charset="utf-8"></script>

<script src="../../common/jquery/jquery-3.0.0.min.js"></script>

引入

然后

if(data.data.exposureImge!="" && data.data.exposureImge!=null){
						var imgurl = '';
						var img = data.data.exposureImge.split(",");
						imgurl += '<div id="mien" class="clearfix">';
					 	for(var i=0;i<img.length;i++){
					 		imgurl += '<img data-original="'+apiManager.exposureStrategy +img[i]+'"  src="'+apiManager.exposureStrategy +img[i]+'" width="150px" height="150px" />'
					 	}
					 	imgurl +='</div>';
					 	console.log(imgurl);
					 	$("#commentsImg").html(imgurl);
                        //需要这个方法  你是拼接的话要写到这里  如果你是在页面写死的要
					 	$('#mien').viewer();
}


写死的时候
<div id="mien" class="clearfix">
				<div class="pull-left mien-l">
					<img data-original="../../img/scenicSpot/img1.png" src="../../img/scenicSpot/img1.png" />
				</div>
				<div class="pull-left mien-c">
					<img data-original="../../img/scenicSpot/img3.png" src="../../img/scenicSpot/img3.png" />
					<img data-original="../../img/scenicSpot/img4.png" src="../../img/scenicSpot/img4.png" />
				</div>
				<div class="pull-right mien-r">
					<img data-original="../../img/scenicSpot/img2.png" src="../../img/scenicSpot/img2.png" />
				</div>
			</div>
在这里引用
<script type="text/javascript">
		$('#mien').viewer();
	</script>

js 插件地址 https://download.csdn.net/download/qq_29072049/10667010 

效果图