遮罩层 js

原创 2016年05月31日 15:14:32

<!DOCTYPE html> 
<html> 
<head> 
<meta charset=" utf-8"> 
<meta name="author" content="http://www.softwhy.com/" /> 
<title>遮罩层</title> 
<style type="text/css"> 
#fade { 
display:none; 
position:absolute; 
top:0%; 
left:0%; 
width:100%; 
height:100%; 
background-color:black; 
z-index:1001; 
-moz-opacity:0.8; 
opacity:.80; 
filter:alpha(opacity=80); 
} 
#light{ 
display:none; 
position:absolute; 
top:25%; 
left:25%; 
width:50%; 
height:50%; 
padding:16px; 
border:3px solid orange; 
background-color:white; 
z-index:1002; 
overflow:auto; 
} 
</style> 
<script type="text/javascript"> 
window.onload=function(){ 
var linkbt=document.getElementById("linkbt"); 
var light=document.getElementById('light'); 
var fade=document.getElementById('fade'); 
var closebt=document.getElementById("closebt"); 
linkbt.onclick=function(){ 
light.style.display='block'; 
fade.style.display='block'; 
} 
closebt.onclick=function(){ 
light.style.display='none'; 
fade.style.display='none'; 
} 
} 
</script> 
</head> 
<body> 
<a href="javascript:void(0)" id="linkbt"> 点击这里打开窗口</a> 
<div id="light"><a href="javascript:void(0)" id="closebt">关闭窗口</a></div> 
<div id="fade""></div> 
</body> 
</html> 

                    

用 js 实现“div的遮罩”效果

需求:点击“排序”按钮,生成div遮罩效果,如图: html代码:两个按钮 html代码:遮罩效果 排序 状...
  • hlbt0112
  • hlbt0112
  • 2016年09月13日 15:22
  • 3415

关于移动端css+js解决遮罩问题方法。

今天找到一种解决方式:当一个页面超过屏幕的时候,会出现滚动,但是当我们弹出遮罩时,会发现还是页面还是可以滚动。 有2种情况: 第一种:就是在弹框的遮罩上有滚动(比如说滚动列表),就是说页面一个滚动,弹...
  • Iamgoodgilr
  • Iamgoodgilr
  • 2016年09月08日 15:42
  • 1314

jQuery BlockUI 插件(遮罩层)

部分效果 概述 当使用AJAX时,jQuery BlockUI插件可以模拟同步行为,并且不会锁定浏览器。一旦被激活,它便会防止页面上(或页面的一部分)用户的操作,直到被停用。BlockUI给DOM...
  • evangel_z
  • evangel_z
  • 2016年04月11日 19:10
  • 1936

移动端遮罩层js

  • 2017年10月24日 14:43
  • 5KB
  • 下载

(HTML+js+css)遮罩层实现源码

  • 2016年04月26日 09:22
  • 88KB
  • 下载

js写登陆遮罩层效果

  • 2015年04月04日 00:34
  • 3KB
  • 下载

js遮罩层小代码

  • 2014年01月15日 23:31
  • 33.73MB
  • 下载

遮罩层 js+css

  • 2014年02月27日 15:05
  • 3KB
  • 下载

遮罩层js代码

  • 2017年04月26日 14:11
  • 1.35MB
  • 下载

js弹出遮罩层

  • 2011年09月13日 17:10
  • 977KB
  • 下载
内容举报
返回顶部
收藏助手
不良信息举报
您举报文章:遮罩层 js
举报原因:
原因补充:

(最多只允许输入30个字)