<%@ page language="java" contentType="text/html; charset=utf-8"
pageEncoding="utf-8"%>
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8">
<title>弹出页面</title>
<script language="javascript" type="text/javascript">
Shade=new function()
{
var handle={};
var shade;
handle.show=function()
{
if(!shade)
{
shade=document.createElement('div');
shade.className='tb-shade';
document.body.appendChild(shade);
}
with((document.compatMode=='CSS1Compat')?document.documentElement:document.body)
{
var ch=clientHeight,sh=scrollHeight;
shade.style.height=(sh>ch?sh:ch)+'px';
shade.style.width=offsetWidth+'px';
shade.style.display='block';
}
};
handle.hide=function()
{
shade.style.display='none';
};
return handle;
}
function showPanel()
{
Shade.show();
document.getElementById('Panel').style.display='block';
document.getElementById('frame').src='http://www.163.com';
document.getElementById('Panel').scrollIntoView();
}
function hidePanel()
{
Shade.hide();
document.getElementById('Panel').style.display='none';
}
</script>
<style>
.tb-shade {
display: none;
z-index: 2007;
filter: alpha(opacity = 60);
left: 0px;
width: 100%;
position: absolute;
top: 0px;
background-color: #000000;
opacity: .6;
}
#Panel {
margin-top: -260px;
display: none;
z-index: 2008;
left: 50%;
margin-left: -325px;
width: 650px;
position: absolute;
top: 50%;
background-color: #FFFFFF
}
</style>
</head>
<body>
<div id="Panel" style="display: none;">
<a style="display: block; float: right;" onclick="hidePanel();"
href="#">【关闭】</a>
<iframe id="frame" style="overflow-X: hidden;" src="about:blank"
frameborder="0" width="650" height="500" scrolling="yes"></iframe>
</div>
<a href="#" onclick="showPanel();return false;"><strong>代码测试</strong>
</a>
</body>
</html>
分享到:
相关推荐
弹出登录页面,背景变暗 弹出登录页面,背景变暗 弹出登录页面,背景变暗
效果很酷,实用,代码简单易懂,点击用户登陆即可在当前页面上弹出一个登陆框且背景变暗。
JS弹窗 JS弹出DIV并使整个页面背景变暗功能的实现代码
JQuery实现对话框效果 即弹出对话框背景变暗且不可操作
div+css实现弹出窗口背景变暗效果 div+css实现弹出窗口
jquery弹出层背景变暗 Ajax jquery弹出层背景变暗_Ajax
弹出提示框,背景压暗,蒙版效果,灰色背景可随窗体大小而自动调整适应大小
弹出居中DIV窗口,背景逐渐变暗,可以在调用时直接定义窗口的大小
带数据div弹出层背景变暗.html DIV弹出层代码,效果很好。方便不换页浏览数据
使用滤镜的方式令imageview的图片变暗
NULL 博文链接:https://highping.iteye.com/blog/362231
是一个关于背景变灰变暗的JS代码,希望对你们有用..
jQuery, 浏览图片,背景变暗,是一个好看的浏览图片方式
11中canvas背景效果,可用于首页,登录页等动态背景;
利用动画来实现背景变暗的效果,可用于弹窗过程中,在视觉上将背景与前景窗口区分开。
又一个简洁实用的jquery弹出框插件,可实现弹出提示框、弹出引用其他URL框、弹出确认框,可以设置在屏幕中显示的位置(正中间)、设置弹窗事件、添加窗口...当弹出浮动对话框后,网页背景变暗,弹出层且支持关闭功能。
网页上div拖拽,弹出div背景变暗 网页上div拖拽,弹出div背景变暗
html5基于canvas制作酷炫带背景动画的后台登录页面模板下载。
背景变暗的div可拖动提示窗口.点击弹出窗口背景变暗
使用jQuery和echarts实现暗背景的统计图显示,适合大屏幕展示效果