一聚教程网：一个值得你收藏的教程网站

ps教程| flash教程| 路由器设置| Jsp教程| 加入收藏

首页游戏下载软件下载专题资讯教程 php教程 asp.net教程 css教程网页制作网页特效手机开发办公数码

+ -

当前位置：一聚教程网 > 网页特效 > 窗口特效

推荐专题

最新下载

1

夏莉的化妆时间中文版
50.4MB 类型： 休闲益智
2

展开地毯
17.06MB 类型： 休闲益智
3

好奇嘟嘟
109.72MB 类型： 休闲益智
4

荒野余生
108.94MB 类型： 休闲益智
5

激光镭射笔
37.47MB 类型： 休闲益智
6

像素火影次世代2025解斑
237.91MB 类型： 休闲益智
7

香水填满
31.54MB 类型： 休闲益智
8

反弹冲刺
53.10MB 类型： 休闲益智
9

喂饱怪物们
49.33MB 类型： 休闲益智
10

卡车任务
83.18MB 类型： 休闲益智

热门教程

1

诛仙2鬼王怎么加点鬼王加点推荐
时间：2025-08-20 类型： 游戏攻略
2

诛仙2见影灵泉奇遇任务怎么做见影灵泉奇遇任务流程攻略
时间：2025-08-20 类型： 游戏攻略
3

三国天下归心诸葛亮怎么样诸葛亮技能介绍一览
时间：2025-08-20 类型： 游戏攻略
4

三国天下归心追击队怎么玩追击队玩法教学
时间：2025-08-20 类型： 游戏攻略
5

三国天下归心武将怎么获得武将获取方法
时间：2025-08-20 类型： 游戏攻略
6

星痕共鸣剧毒蜂巢怎么获取剧毒蜂巢获取攻略
时间：2025-08-20 类型： 游戏攻略
7

新三国志曹操传李儒之影怎么打李儒之影打法教学
时间：2025-08-20 类型： 游戏攻略
8

辉烬队伍怎么搭配配队攻略指南
时间：2025-08-20 类型： 游戏攻略
9

创造吧我们的星球种田玩法怎么玩种田玩法介绍一览
时间：2025-08-20 类型： 游戏攻略
10

华夏千秋怎么表白表白方法一览
时间：2025-08-20 类型： 游戏攻略

javascript中获取浏览器窗口中可视区域

时间：2022-06-25 22:07:53 编辑：袖梨来源：一聚教程网

提示：您可以先修改部分代码再运行

<style type="text/<a href=" http: target="_blank">css">
body {
	height:100%;
	margin:0;
	padding:0;
}
#warp {
	position:absolute;
	top:0;
	left:0;
	background:#059B9A;
	z-index:100;
	filter:alpha(opacity=50); /* IE */
	-moz-opacity:0.5; /* Moz + FF */
	opacity: 0.5;
}
</style>

<script type="text/javascript">
function getViewportInfo()
{
	var w = (window.innerWidth) ? window.innerWidth : (document.documentElement && document.documentElement.clientWidth) ? document.documentElement.clientWidth : document.body.offsetWidth;
	var h = (window.innerHeight) ? window.innerHeight : (document.documentElement && document.documentElement.clientHeight) ? document.documentElement.clientHeight : document.body.offsetHeight;
	return {w:w,h:h};
};

function setEl()
{
	var info = getViewportInfo();
	var el = document.getElementById('warp');
	el.style.px';
	el.style.px';
}

window.onload = function() {
	setEl();
}
window.onresize = function() {
	setEl();
}

</script>

<div id="warp" onclick="document.getElementById('warp').style.display='none'"></div>

<div style="text-align:center;font-weight:bold;margin:20px 0;">
	如果你看到一个半透明的层，并且窗口中没有出现滚动条，说明示例运行正常.<br>
	点击可以关闭透明层。
</div>

提示：您可以先修改部分代码再运行

相关文章

热门栏目