网站动态添加iframe覆盖全站

有需求,以防以后再有,记录下

<!DOCTYPE html>
<html>
	<head>
		<meta charset="utf-8" />
		<meta name="viewport" content="width=device-width, initial-scale=1">
		<title></title>
		<script language="JavaScript" src="jquery-1.11.1.min.js" type="text/javascript"></script>
	</head>
	<script>
		function IsPC() {
			var userAgentInfo = navigator.userAgent;
			var Agents = ["Android", "iPhone",
				"SymbianOS", "Windows Phone",
				"iPad", "iPod"
			];
			var flag = true;
			for (var v = 0; v < Agents.length; v++) {
				if (userAgentInfo.indexOf(Agents[v]) > 0) {
					flag = false;
					break;
				}
			}
			return flag;
		}

		function showIframe(url, w, h) {
			//添加iframe
			var if_w = w;
			var if_h = h;
			//allowTransparency='true' 设置背景透明
			$("<iframe width='" + if_w + "' height='" + if_h +
				"' id='YuFrame1' name='YuFrame1' style='position:absolute;z-index:999;'  frameborder='no' marginheight='0' marginwidth='0' allowTransparency='true'></iframe>"
			).prependTo('body');
			var st = document.documentElement.scrollTop || document.body.scrollTop; //滚动条距顶部的距离
			var sl = document.documentElement.scrollLeft || document.body.scrollLeft; //滚动条距左边的距离
			var ch = document.documentElement.clientHeight; //屏幕的高度
			var cw = document.documentElement.clientWidth; //屏幕的宽度
			var objH = $("#YuFrame1").height(); //浮动对象的高度
			var objW = $("#YuFrame1").width(); //浮动对象的宽度
			var objT = Number(st) + (Number(ch) - Number(objH)) / 2;
			var objL = Number(sl) + (Number(cw) - Number(objW)) / 2;
			$("#YuFrame1").css('left', objL);
			$("#YuFrame1").css('top', objT);

			$("#YuFrame1").attr("src", url)

			//添加背景遮罩
			$(
				"<div id='YuFrame1Bg' style='background-color: Gray;display:block;z-index:3;position:absolute;left:0px;top:0px;filter:Alpha(Opacity=30);/* IE */-moz-opacity:0.4;/* Moz + FF */opacity: 0.4; '/>"
			).prependTo('body');
			var bgWidth = Math.max($("body").width(), cw);
			var bgHeight = Math.max($("body").height(), ch);
			$("#YuFrame1Bg").css({
				width: bgWidth,
				height: bgHeight
			});

			//点击背景遮罩移除iframe和背景
			$("#YuFrame1Bg").click(function() {
				$("#YuFrame1").remove();
				$("#YuFrame1Bg").remove();
			});
		}
		$(document).ready(function() {
			if (IsPC()) {
				showIframe('//eyunzhu.com', window.screen.width, window.screen.height-130);
			} else {
				showIframe('//v.eyunzhu.com', window.screen.width, window.screen.height);
			}

		});
		// setTimeout(function(){
		// 	showIframe('https://eyunzhu.com',800,680);
		// },1000)
	</script>
	<body>
		我是一个 网站
	</body>
</html>
admin

发表评论

:?: :razz: :sad: :evil: :!: :smile: :oops: :grin: :eek: :shock: :???: :cool: :lol: :mad: :twisted: :roll: :wink: :idea: :arrow: :neutral: :cry: :mrgreen: