I need a script to generate a popup when page loads with background disabled. Please help
dips255 0 Light Poster
zhoush24 0 Newbie Poster
I need a script to generate a popup when page loads with background disabled. Please help
dfasdasdasd
asd
a
d
asd
asdasdasd
a
sd
asd
as
dasd
essential 84 Posting Shark Featured Poster
Try this simple demo of a custom popup:
<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN"
"http://www.w3.org/TR/html4/loose.dtd">
<html id="html40L" lang="en">
<head>
<meta http-equiv="X-UA-Compatible" content="IE=EmulateIE7">
<meta http-equiv="Content-Type" content="text/html; charset=utf-8">
<meta http-equiv="Content-Style-Type" content="text/css">
<meta http-equiv="Content-Script-Type" content="text/javascript">
<meta http-equiv="Window-target" content="_top">
<title>Free Live Help!</title>
<style type="text/css">
<!--
label + div {
margin-bottom : 1em; font : 700 16pt "Trebuchet MS", "Bernard MT Condensed", Verdana, Arial, sans-serif; }
-->
</style>
<script type="text/javascript">
<!--
var customPopup = function( w, h, elem ) {
elem = (( document.getElementById ) ? document.getElementById( elem ) : document.all[ elem ] );
var checked = true;
var posTop;
var posLeft;
try {
if ( document.body.scrollWidth ) {
posLeft = document.body.scrollWidth;
posTop = (( window.screen.availHeight ) ? screen.availHeight : document.body.scrollHeight );
}
} catch( error ) {
if ( window.scrollMaxY ) {
posLeft = window.scrollMaxX;
posTop = window.scrollMaxY;
} else {
check = false;
}
} if ( checked ) { // You can implement more style rules from here.
var divWidth = (( posLeft * w ) / 100 );
var divHeight = (( posTop * h ) / 100 );
elem.style.width = divWidth;
elem.style.height = divHeight;
elem.style.backgroundColor = "#eee";
elem.style.border = "2px solid #405060";
elem.style.position = "absolute";
elem.style.left = Math.ceil((( posLeft - divWidth ) / 2 )) + "px";
elem.style.top = Math.ceil((( posTop - divHeight ) / 2 )) + "px";
}
};
window.onload = function() {
customPopup( 40, 40, "main" );
}
// -->
</script>
</head>
<body>
<div id="main"><div style="padding : 1em; color : #405060; text-align : center"><h1 style="margin : 0 auto; padding : 0;">Custom Popup</h1></div></div>
</body>
</html> sakherdael 0 Newbie Poster
this is your code babe:
<HTML>
<HEAD>
<TITLE>PopUp Div + Background Disable</TITLE>
<style>
body
{
background-image:url("1.gif");
}
.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%;
background-image:url(catbg-1.gif);
}
#close
{
position:absolute;
top:0;
right:0;
}
</style>
<script type="text/javascript">
function pop(div)
{
document.getElementById(div).style.display='block';
return false
}
function hide(div)
{
document.getElementById(div).style.display='none';
return false
}
</script>
</HEAD>
<BODY>
<div id="pop1" class="parentDisable">
<center>
<div id="popup">
This is popup 1
<a href="#" onClick="return hide('pop1')">
<div id="close">
<img src="close.png" width="40px" height="40px"/>
</div>
</a>
</div>
</div>
<center>
<h3>Simple Popup Div + Background Disable Example</h3>
</br></br>
<a href="#" onClick="return pop('pop1')">Popup 1</a>
</center>
</BODY>
</HTML>
if u need any thing i am ready for any thing.....
Good luck..
Eng.M.Dael
Professional Designer & Web Developer
(snip)
zeeshan88 0 Newbie Poster
Thanks, Eng.M.Dael, your popup with disabled background is working great for me
Be a part of the DaniWeb community
We're a friendly, industry-focused community of developers, IT pros, digital marketers, and technology enthusiasts meeting, networking, learning, and sharing knowledge.