Open Div,Hidden Select ,Flash

最新推荐文章于 2020-11-19 13:47:20 发布
最新推荐文章于 2020-11-19 13:47:20 发布
阅读量168 收藏
点赞数
分类专栏： javascript 文章标签： Flash Firefox IE 脚本 JavaScript ViewUI
版权声明：本文为博主原创文章，遵循 CC 4.0 BY-SA 版权协议，转载请附上原文出处链接和本声明。
本文链接：https://blog.csdn.net/LibraMX/article/details/83325454
版权

function Open(){
  //隐藏select控件
  DispalySelect(0); 
  //显示遮罩层
  $("divPageMask").style.display="block";
 //处理遮罩层
  resizeMask();
  window.onResize = resizeMask;
  //显示弹出窗口
  $("divOpenWin").style.display="block";
}
function Close(){
  //显示select控件
  DispalySelect(1);
  //处理遮罩层
  var m = $("divPageMask");
  m.style.width = "0px";
  m.style.height = "0px";
  var o = $("divOpenWin");
  o.style.display = "none";
  window.onResize = null;
  o.style.display="none";
}
//页面遮罩
function resizeMask(){
  var m = $("divPageMask");
  m.style.width = document.documentElement.clientWidth+'px';
  m.style.height = resizeHeight()+'px';
  var o = $("divOpenWin");
   o.style.left = ((document.documentElement.clientWidth - 600) / 2)+'px';
  o.style.top = ((document.documentElement.clientHeight - 400) / 2)+'px';
}
function DispalySelect(val){ 
 //显示和隐藏select控件
  var dispalyType;
   var arrdispalyType=["hidden","visible"];
   var arrObjSelect=document.getElementsByTagName("select");
   for (i=0;i<arrObjSelect.length;i++){
     arrObjSelect[i].style.visibility=arrdispalyType[val];
   }
}
function resizeHeight(){
 var ch = document.documentElement.clientHeight;
 var oh = document.documentElement.scrollHeight;
 if(ch>oh){ return ch;}else{ return oh}
}

 

此脚本只适用于如下的DOCTYPE

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">

在IE和FireFox下均正常

HTML:

<div id="divPageMask"></div>
<div id="divOpenWin">
内容区域<a href="javascript:Close();">Close</a>
</div>

 

具体适用方式是：可以通过页面上的某个按钮和超链接触发脚本的Open方法，然后在内容区写上关闭的方法就行了。

上面代码来自网络，感谢贡献者，只是自己增加了resizeHeight方法，因为如果按作者原来的写法只能遮罩文档大小，如果文档内容小于屏幕高度，则不会遮罩下部分，resizeHeight通过比较当前是取文档高度还是屏幕高度。另外要注意的是在设置height和width时要加上px，否则firefox就不认了。

另外别忘记两个div的样式，具体怎么做，你自己修改就行了

#divPageMask{
 background-color:#000000;
 filter:alpha(opacity=50);
 -moz-opacity:.5;
 opacity:0.5;
 left:0px;
 position:absolute;
 top:0px;
}
#divOpenWin{background-color:#FFFFFF;position: absolute;left:0px;top:0px;display: none;z-index:50; width:700px;height:auto}

LibraMX
关注
专栏目录
95. SAP UI5 下拉菜单(Select) 控件的使用方式
汪子熙的专家技术分享
05-30 1477
本教程前一步骤，我们已经实现了一个简单的 SAP UI5 表格分页显示的需求，效果如下： 在本教程后续步骤里，我们会一步步对目前这个已经完成的应用进行优化。 目前我们对每页显示的产品个数是硬编码为 20，本步骤我们会对这个硬编码进行优化，允许用户能够指定分页的大小，可以在 20，30 和 50 三种大小里选择。因此，需要学习如何使用 SAP UI5 的下拉菜单，即 sap.m.Select 来给用户提供选择。 本步骤我们暂时不考虑 SAP UI5 表格的分页显示，先将 sap.m.Select 的使用方式
select2动态填充数据（豪华VIP自定义option）
hangGe0111的博客
12-29 2445
1.代码 &lt;!DOCTYPE html&gt; &lt;html&gt; &lt;head&gt; &lt;meta charset="UTF-8"&gt; &lt;title&gt;select2&lt;/title&gt; &lt;link href="https://cdnjs.cloudflare.com/ajax/libs/select2/4
一个open div
mrx1005的专栏
05-07 571
- <!-- BODY { MARGIN: 0px } #Loading { BORDER-RIGHT: #cccccc 3px solid; BORDER-TOP: #cccccc 3px solid; Z-INDEX: 10; BACKGROUND: #ffffff; LEFT: 10px; BORDER-LEFT: #cccccc 3px solid; W
展开/收缩DIV层面板（Open/Close Div Layers）
我的收藏
12-21 3797
Open/Close Div LayersThis code snippet demonstrates using a container div, which can be expanded or collapsed to show/hide blocks of content. For my javascript function names, I pondered items tha
layer open div 注意事项
zy835859234的博客
11-19 1691
1、要弹窗的div,一般需要隐藏，隐藏必须加 display:none; 比如 *限购： <li class="d-inline-block " id="xiangou_num_type"> <select class="form-control "
【前端】div模拟select（带有滚动条）
而我想……成为一个有趣的妞
05-11 1599
之前要在option里面做mouseover事件，在谷歌、火狐、搜狗上面都可以使用，但是IE不支持。 在此情况之下，选择用div模拟一个select 下面贴代码： html &lt;div class="mod_select"&gt; &lt;ul&gt; &lt;li&gt; &lt;div class="sele...
div模拟select下拉菜单
u012668297的专栏
07-11 796
点击按钮，将按钮变成文本框  transform = function(key){         key.style.display="none";         document.getElementById("txt").style.display="block"     }
layui layer select 选择被遮挡的解决方法
10-16
1. 找到与layer弹窗关联的CSS类，通常是包含select的最外层div。例如，可能会是`.layui-table-body`、`.layui-table-box`或`.layui-table-view`等类。 2. 修改这些类的`overflow`属性为`visible`。这将允许内容...
bootstrap-select 插件使用详解
liinux-Talk is cheap,show me the code.
12-12 879
一、简单使用示例 1、下载bootstrap-select，创建页面SelectDemo，页面中添加如下引用 <script src="Scripts/bootstrap-select/js/bootstrap-select.min.js"></script> <script src="Scripts/bootstrap-select/js/i18n/defau...
openDivWindow
12-09
openDivWindow
<div class="layui-form-item" > <div class="layui-input-inline" > <div class="layui-form-select ySearchSelect y1" style="width:850px" > <div class="layui-input"></div> <i class="layui-edge" ></i> <ul> <% Dim crscdjname Set crscdjname = server.CreateObject("adodb.recordset") crscdjname.Open "select * from newsdaojuname_category where category=1 order by order_id asc", conn, 1, 1 While Not crscdjname.EOF response.Write("<li class=on onclick=onInfoClick(" & crscdjname("id") & ",newsdaojuname_category)>" & crscdjname("title") & "</li>") crscdjname.movenext Wend crscdjname.Close Set crscdjname = Nothing Dim frscdjname Set frscdjname = server.CreateObject("adodb.recordset") frscdjname.Open "select * from newsdaojuname_category where category=2 order by order_id asc", conn, 1, 1 While Not frscdjname.EOF response.Write("<li class=on ><input type=hidden value="& frscdjname("id") &" />" & frscdjname("title") & "</li>") frscdjname.movenext Wend frscdjname.Close Set frscdjname = Nothing %> <p>无匹配项</p> </ul> </div> </div> <script> $(function() { $(".y1").ySearchSelect(); //调用自定义 高亮插件 }) </script> </div>这边代码无法传值newsdaojuname_category
06-07
这是一段 ASP 代码，用于从数据库中读取新闻分类，并将其显示为下拉菜单的形式。其中，数据库表名为 "newsdaojuname_category"，分类分为两个类别，分别为 "category=1" 和 "category=2"。在菜单中选择项时，会调用...
window.open()打开窗口的几种方式
热门推荐
清箫的专栏
12-31 9万+
1. 在当前窗口打开百度,并且使URL地址出现在搜索栏中.window.open("http://www.baidu.com/", "_search");window.open("http://www.baidu.com/", "_self"); 2. 在一个新的窗口打开百度window.open("http://www.baidu.com/", "_blank"); 
window.open()打开页面的几种方法
yzy85的专栏
03-20 2万+
主要原理：利用_blank属性打开页面 function OpenWindow(n, t, i, r) { var u = (screen.width - t) / 2 - r, f = (screen.height - i) / 2 - r, e = window.open(n, "_blank", "width=" + t + ",height=" + i +
window.open()方法（弹出层）
张亚运的专栏
12-23 5478
1, 最基本的弹出窗口代码    window.open('page.html'); 2, 经过设置后的弹出窗口    window.open('page.html', 'newwindow', 'height=100, width=400, top=0, left=0, toolbar=no, menubar=no, scrollbars=no, resizable=no, locat
window.open 在父页面操纵子页面元素
persistencequxi的博客
01-09 3505
父页面： Title function showmodelwindow() { var itop = (window.screen.availheight - 510) / 2; //获得窗口的垂直位置; var ileft = (window.screen.availwidth - 650) /
JavaScript父窗口与子窗口之间的操作总结---window.open篇
Cui55的专栏
09-18 1万+
window.open 篇 1.父窗口对子窗口操作  打开：  var win=null;  win=window.open("Open.html","win","width=200,height=200");  最大化：  //窗口最大化  function SonMaximize()  {         if(win&&win.open&&!wi
向前维泰比算法Matlab代码.rar
最新发布
10-09
1.版本：matlab2014/2019a/2024a 2.附赠案例数据可直接运行matlab程序。 3.代码特点：参数化编程、参数可方便更改、代码编程思路清晰、注释明细。 4.适用对象：计算机，电子信息工程、数学等专业的大学生课程设计、期末大作业和毕业设计。
Open-Flash-Chart手册：Flash图表绘制工具指南
资源摘要信息: "Open-Flash-Chart是一个广泛使用的开源Flash图表绘制工具，它允许用户利用Flash技术通过ActionScript语言创建各种类型的动态图表。该工具对数据的可视化提供了便捷而强大的解决方案，用户无需深入...
评论
添加红包

请填写红包祝福语或标题

个

红包个数最小为10个

元

红包金额最低5元

当前余额3.43元 前往充值 >
需支付：10.00元
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付元
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明：

1.余额是钱包充值的虚拟货币，按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载，可以购买VIP、付费专栏及课程。

余额充值