Skip to main content

Javascript Popup with background blocked

Created a simple .aspx page to show Javascript Popup, which will block the background.

To implment this, we need to create.
  1. Css - style for DIV
  2. JavaScript - to support this functionality
  3. DIV tage in .aspx page - used to show/hide on click
  4. Button - to get Event

Following is the simple sample code that, You can use for this fucntionality.

<html>
<
head>
<script type="text/javascript">function showPopUp(el) {
var cvr = document.getElementById("cover")
var dlg = document.getElementById(el)cvr.style.display =
"block"dlg.style.display = "block"if (document.body.style.overflow = "hidden") {cvr.style.width =
"1024"cvr.style.height = "100%"}
}
function closePopUp(el) {
var cvr = document.getElementById("cover")
var dlg = document.getElementById(el)cvr.style.display =
"none"dlg.style.display = "none"document.body.style.overflowY = "scroll"}
</script>

<style type="text/css">#cover {
display: none;
position: absolute;
left: 0px;
top: 0px;
width: 100%;
height: 100%;
background: gray;
filter: alpha(Opacity = 50);
opacity: 0.5;
-moz-opacity: 0.5;
-khtml-opacity: 0.5}
#dialog {
display: none;
left: 100px;
top: 100px;
width: 300px;
height: 300px;
position: absolute;
z-index: 100;
background: white;
padding: 2px;
font: 10pt tahoma;
border: 1px solid gray}
</style>
</
head><
body><
form runat="server"><
div id="cover"></div><
div id="dialog">Popup DIV<br/><input type="text"/><asp:TextBox ID="TextBox1" runat="server"></asp:TextBox><br/><input type="button" value="Submit"/><br/><a href="#" onclick="closePopUp('dialog');">[Close]</a></
div><
a href="#" onclick="showPopUp('dialog');">Show</a></
form></
body></
html>

Comments

  1. Your work is very good and I appreciate you and hopping for some more informative posts. Thank you for sharing great information to us. background remover

    ReplyDelete

Post a Comment

Popular posts from this blog

WCF MaxReceivedMessageSize max value in .config

MaxReceivedMessageSize parameter in binding config   file:   For max file size in WCF, we need to set following parameter in binding files. <binding name="MyService"        maxReceivedMessageSize="2147483647"        maxBufferSize="2147483647" transferMode="Streamed" >        <readerQuotas maxDepth="2147483647" maxStringContentLength="2147483647"      maxArrayLength="2147483647" maxBytesPerRead="2147483647" maxNameTableCharCount="2147483647"/> <!-- other binding info here, such as security --> </binding> Max possible size: MaxReceivedMessageSize to 2147483647 (i.e. Int32.MaxValue), which is 2GB For our case, as we are using WsHttpBinding. <wsHttpBinding>         <binding name="wsHttpBindingSettings" maxReceivedMessageSize="2147483647">      ...

Deploying Custom Pipeline Component on BizTalk Server (PROD)

Deploying Custom Pipeline Component on BizTalk Server: ·         Deploying BizTalk Custom Pipeline Component   on BizTalk Server 2006 or Older Version : To deploy the custom Pipeline component on BizTalk server 2006 or older version. We need to add the Custom Pipeline component in GAC as well as “ C:\Program Files (x86)\Microsoft BizTalk Server 2006\Pipeline Components ” folder.   At design time it will access the Pipeline component dll located in “….. Microsoft   BizTalk Server 2006\Pipeline Components ” folder and show the component in pipeline toolbox. At runtime the BizTalk will use the Custom Pipeline component from GAC. ·         Deploying BizTalk Custom Pipeline Component   on BizTalk Server 2006 R2 or New Version : To deploy the custom Pipeline component on BizTalk server 2006 R2 or later version. We need to add the Custom Pipeline component only in “C:\Pr...

biztalk schema remove ns0 prefix

We can remove ns0 prefix simply by set the schema elements property or both elements and attributes properties to be qualified. To do that follow my steps: 1-       Open your schema 2-       Right Click <Schema> and select properties 3-       Use schema property editior and Set [Element FromDefult] to Unqualified , and then set [Attribute FromDefault] to Unqualified if you are using attributes in your schema. After applying the steps above, both XML instances below will be valid: Instance 1 (with ns0) < ns0:Root xmlns:ns0 = " http://RandomBizTalkProject.Schema1 " >   < Field1 > Field1_0 </ Field1 >   < Field2 > Field2_0 </ Field2 > </ ns0:Root > Instance 2 (without ns0) < Root xmlns = " http://RandomBizTalkProject.Schema1 " >   < Field1 > Field1_0 </ Field1 >   < Field2 >...