想要禁用div后面的页面. [英] want to disable page behind div.

查看:76
本文介绍了想要禁用div后面的页面.的处理方法,对大家解决问题具有一定的参考价值,需要的朋友们下面随着小编来一起学习吧!

问题描述

页面上有网格,页面上有一些按钮.

我做了一个div,并通过设置其上,下,右宽度使其显示为弹出窗口,并在单击按钮时使其可见.

现在,当div像页面上的弹出窗口一样可见时,我希望禁用后页,这意味着用户无法对其执行任何操作.

请让我知道该怎么做

任何适当的答案将不胜感激.

I have grid on page and some buttons on the page.

i made one div and by setting its top,left,right width made it show like a pop up and make it visible on clicking of button.

now when div get visible like a pop up on page i want back page to be disabled means user cant perform any action over it.

Please let me know how to do this

Any appropriate answer will be appreciated.

推荐答案

好的,这里是您要做的事情



创建半透明gif或透明gif

创建图像标签
OK here''s what you have to do



Create a semi transparent gif, or transparent gif

create an image tag
<img src="transp.gif" style="zindex=20; position:absolute; Top:0; Left:0; witdh:100%; height:100%" />



然后创建div并记住将索引设置为图像上方的索引



and then create your div remember the index to set it above the image

<div id="hideUnhideEct" style="zindex=21">div content</div>



它仍然需要进行一些实验和跨浏览器测试,但是我之前使用过它,您还应该考虑在div和image上使用position:absolute

请记住IE9中的位置绝对限制(出于某种原因,他们把它弄乱了),最简单的解决方案是从文档的标题中删除doctype.


请记住,将宽度和高度设置为100%以包含在样式表中时



it still bears some experimenting and cross browser testing but I used this before, you should also consider using position:absolute on your div and image

Please keep in mind the position absolute restrictions in IE9 (for some reason they messed it up) easiest solution is to remove the doctype from the header of the document.


Remember when setting 100% width and height to include in your stylesheet

body, html, form{
width:100%;
height:100%;
padding: 0 0 0 0;
margin: 0 0 0 0;
}


基本逻辑是与 CSS 一起使用.有一个 z-index 在建立图层中起作用.在需要时显示覆盖的div,然后将其隐藏起来.

我有一段时间从网上回来了.不是我的.试试:
Basic logic is to play with CSS. There is a z-index that plays a role in putting up a layer. Show the overlaying div when needed and then hide it back.

I got this sometime back from net. Not mine. Try:
.parentDisable
{
  z-index:999;
  width:100%;
  height:100%;
  display:none;
  position:absolute;
  top:0;
  left:0;
  background-color: #000;
  color: #aaa;
  opacity: .4;
  filter: alpha(opacity=50);
}
#popup
{
  width:300;
  height:300;
  position:relative;
  color: #000;
  background-color: #fff;
  top:25%;
}
#close
{
  position:absolute;
  top:0;
  right:0;
}


function pop(div)
{
  document.getElementById(div).style.display='block'
  return false;
}
function hide(div)
{
  document.getElementById(div).style.display='none'
  return false;
}


<body>
 <div id="pop1" class="parentDisable">
  <center>
    <div id="popup">
        This is popup 1
        <input title="Click" type="button" name="Click Me" value="Click Me" />
        <a href="#" onclick="return hide('pop1')">
           <div id="close">
               <img src="close.png" width="40px" height="40px" />
           </div>
        </a>
    </div>
  </center>
 </div>
 <center>
    <h3>Simple Popup Div + Background Disable Example</h3>
      <a href="#" onclick="return pop('pop1')">Popup 1</a>
 </center>
</body>


这篇关于想要禁用div后面的页面.的文章就介绍到这了,希望我们推荐的答案对大家有所帮助,也希望大家多多支持IT屋!

查看全文
登录 关闭
扫码关注1秒登录
发送“验证码”获取 | 15天全站免登陆