最简单的，点击图片放大

html xmlns="http://www.w3.org/1999/xhtml">
	head>
		meta charset="utf-8">
		meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1">
		meta name="viewport" content="width=device-width, initial-scale=1, maximum-scale=1, user-scalable=no">
		meta name="apple-mobile-web-app-capable" content="yes">
		meta name="apple-mobile-web-app-status-bar-style" content="black">
		meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1">
		style>
			.over {
				position: fixed;
				left: 0;
				top: 0;
				width: 100%;
				z-index: 100;
			}

			.tempContainer {
				position: fixed;
				width: 100%;
				margin-right: 0px;
				margin-left: 0px;
				text-align: center;
				z-index: 101;
			}
		style>
		script src="js/jquery.min.js">script>
	head>
	body>
		div class="over">div>
		
		div class="logoImg amplifyImg">
			
			img src="ewm.jpg" />
		div>
		script>
			$(document).ready(function() {
				var imgsObj = $('.amplifyImg img'); //需要放大的图像
				if (imgsObj) {
					$.each(imgsObj, function() {
						$(this).click(function() {
							var currImg = $(this);
							coverLayer(1);
							var tempContainer = $('
'); //图片容器
							with(tempContainer) { //width方法等同于$(this)
								appendTo("body");
								var windowWidth = $(window).width();
								var windowHeight = $(window).height();
								//获取图片原始宽度、高度
								var orignImg = new Image();
								orignImg.src = currImg.attr("src");
								var currImgWidth = orignImg.width;
								var currImgHeight = orignImg.height;
								if (currImgWidth //为了让图片不失真，当图片宽度较小的时候，保留原图
									if (currImgHeight var topHeight = (windowHeight - currImgHeight) / 2;
										if (topHeight > 35) {
											/*此处为了使图片高度上居中显示在整个手机屏幕中：因为在android,ios的微信中会有一个title导航，35为title导航的高度*/
											topHeight = topHeight - 35;
											css('top', topHeight);
										} else {
											css('top', 0);
										}
										html(') + '>');
									} else {
										css('top', 0);
										html(') +
											' height=' + windowHeight + '>');
									}
								} else {
									var currImgChangeHeight = (currImgHeight * windowWidth) /
										currImgWidth;
									if (currImgChangeHeight var topHeight = (windowHeight - currImgChangeHeight) / 2;
										if (topHeight > 35) {
											topHeight = topHeight - 35;
											css('top', topHeight);
										} else {
											css('top', 0);
										}
										html(') +
											' width=' + windowWidth + ';>');
									} else {
										css('top', 0);
										html(') +
											' width=' + windowWidth + '; height=' +
											windowHeight + '>');
									}
								}
							}
							tempContainer.click(function() {
								$(this).remove();
								coverLayer(0);
							});
						});
					});
				} else {
					return false;
				}
				//使用禁用蒙层效果
				function coverLayer(tag) {
					with($('.over')) {
						if (tag == 1) {
							css('height', $(document).height());
							css('display', 'block');
							css('opacity', 1);
							css("background-color", "#FFFFFF");
							css("background-color", "rgba(0,0,0,0.7)"); //蒙层透明度
						} else {
							css('display', 'none');
						}
					}
				}
			});
		script>
	body>
html>