元素可以把滚动条覆盖住吗 元素可以把滚动条覆盖住吗 解决方案 » 免费领取超大流量手机卡,每月29元包185G流量+100分钟通话, 中国电信官方发货 浏览器的不行,DOM元素的可以 哦,想实现遮罩层盖住滚动条的,不过后来想起来把它隐藏了,初步实现模仿firefox alert弹出层效果 <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> <html xmlns="http://www.w3.org/1999/xhtml"> <head> <meta http-equiv="Content-Type" content="text/html; charset=utf-8" /> <title>基于JQuery的JS遮罩层效果</title> <script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.2.6/jquery.min.js"></script> <script type="text/javascript"> function showDiv() { document.body.style.overflow = 'hidden'; var docHeight = Math.max(document.documentElement.scrollHeight, document.documentElement.clientHeight); var docWidth = Math.max(document.documentElement.scrollWidth, document.documentElement.clientWidth); var _div = document.createElement('div'); _div.className = 'divClass'; _div.setAttribute('id', 'divId'); document.body.appendChild(_div); document.getElementById('divId').style.width = docWidth + 'px'; document.getElementById('divId').style.height = docHeight + 'px'; var _divAlert = document.createElement('div'); _divAlert.className = 'divalert'; _divAlert.id = 'divalert'; document.body.appendChild(_divAlert); document.getElementById('divalert').style.left = (document.documentElement.clientWidth - 200)/2 + 'px'; document.getElementById('divalert').style.top = (document.documentElement.clientHeight - 100)/2 + 'px'; var _divContent = document.createElement('div'); _divContent.id = 'divcontent'; _divAlert.appendChild(_divContent); var _divbtn = document.createElement('div'); _divbtn.id = 'divbtn'; var _btn = document.createElement('input'); _btn.type = 'button'; _btn.value = '确定'; _btn.id = 'btn'; _divbtn.appendChild(_btn); _divAlert.appendChild(_divbtn); document.getElementById('btn').onclick = function() { document.getElementById('divId').style.display = 'none'; document.getElementById('divalert').style.display = 'none'; document.body.style.overflow = 'auto'; } } function resizeDiv() { var docHeight = Math.max(document.documentElement.scrollHeight, document.documentElement.clientHeight); var docWidth = Math.max(document.documentElement.scrollWidth, document.documentElement.clientWidth); document.getElementById('divId').style.width = document.documentElement.clientWidth + 'px'; document.getElementById('divId').style.height = document.documentElement.clientHeight + 'px'; } window.onload = function() { showDiv(); } window.onresize = resizeDiv; </script> <style type="text/css"> body { margin:0; padding:0; } .divClass { position:absolute; left:0; top:0; background-color:#ccc; z-index:0; } .divalert { position:absolute; z-index:2000; width:200px; height:100px; border:1px solid #666; background-color:#fff; } #divcontent { height:60px; } #divbtn { height:40px; background-color:#ddd; text-align:center; } #btn { border:1px solid #000; margin-top:10px; } </style> </head> <body> <div style='height:1000px;'>fsfs</div> </body> </html> 代码好长,自己使用div处理滚动,不要让浏览器的滚动条出现。 可以改成position: fixed;定位方式,就不用理会浏览器的滚动条了 网页滚动图片代码问题 请问可否在同一页面调用同一函数 如保使当前网页中的播放视频自动暂停 求救:弹出窗口不显示图片 js里动态创建了一个img 并且添加了他的click事件,我在其他地方如何也调用这个img的click事件? 关于FireFox与IE下的CURSOR兼容性问题 50分求一获取url页面参数的javascript脚本 弹出窗口的值怎么传回父页面 谁有IE内建对象(window,document等)所有属性和方法大全啊? netscape4.7中动态下拉框长度的设置问题 [问]鼠标经过,怎么改变另外一个地方的背景图片 javascript syntax error
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>基于JQuery的JS遮罩层效果</title>
<script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.2.6/jquery.min.js"></script>
<script type="text/javascript">
function showDiv() {
document.body.style.overflow = 'hidden';
var docHeight = Math.max(document.documentElement.scrollHeight,
document.documentElement.clientHeight);
var docWidth = Math.max(document.documentElement.scrollWidth,
document.documentElement.clientWidth);
var _div = document.createElement('div');
_div.className = 'divClass';
_div.setAttribute('id', 'divId');
document.body.appendChild(_div);
document.getElementById('divId').style.width = docWidth + 'px';
document.getElementById('divId').style.height = docHeight + 'px';
var _divAlert = document.createElement('div');
_divAlert.className = 'divalert';
_divAlert.id = 'divalert';
document.body.appendChild(_divAlert);
document.getElementById('divalert').style.left = (document.documentElement.clientWidth - 200)/2 + 'px';
document.getElementById('divalert').style.top = (document.documentElement.clientHeight - 100)/2 + 'px';
var _divContent = document.createElement('div');
_divContent.id = 'divcontent';
_divAlert.appendChild(_divContent);
var _divbtn = document.createElement('div');
_divbtn.id = 'divbtn';
var _btn = document.createElement('input');
_btn.type = 'button';
_btn.value = '确定';
_btn.id = 'btn';
_divbtn.appendChild(_btn);
_divAlert.appendChild(_divbtn);
document.getElementById('btn').onclick = function() {
document.getElementById('divId').style.display = 'none';
document.getElementById('divalert').style.display = 'none';
document.body.style.overflow = 'auto';
}
}
function resizeDiv() {
var docHeight = Math.max(document.documentElement.scrollHeight,
document.documentElement.clientHeight);
var docWidth = Math.max(document.documentElement.scrollWidth,
document.documentElement.clientWidth);
document.getElementById('divId').style.width = document.documentElement.clientWidth + 'px';
document.getElementById('divId').style.height = document.documentElement.clientHeight + 'px';
}
window.onload = function() {
showDiv();
}
window.onresize = resizeDiv;
</script>
<style type="text/css">
body { margin:0; padding:0; }
.divClass { position:absolute; left:0; top:0; background-color:#ccc; z-index:0; }
.divalert { position:absolute; z-index:2000; width:200px; height:100px; border:1px solid #666; background-color:#fff; }
#divcontent { height:60px; }
#divbtn { height:40px; background-color:#ddd; text-align:center; }
#btn { border:1px solid #000; margin-top:10px; }
</style>
</head>
<body>
<div style='height:1000px;'>fsfs</div>
</body>
</html>