Javascript language

adplus-dvertising
Create a Popup using JavaScript
Previous Home Next

How to Create a Popup using JavaScript

Step 1. Written below code in your application.

HTML Code:

<html> 
 <script language="javascript">
 x = 20;
y = 70;
function set_visible(obj)
{
 obj = document.getElementById(obj);
 obj.style.visibility = (obj.style.visibility == 'visible') ? 
 'hidden' : 'visible';
}
function place_It(obj)
{
obj = document.getElementById(obj);
if (document
.documentElement)
{
theLeft = document.documentElement.scrollLeft;
theTop = document.documentElement.scrollTop;
}
else if (document.body)
{
theLeft = document.body.scrollLeft;
theTop = document.body.scrollTop;
}
theLeft += x;
theTop += y;
obj.style.left = theLeft + 'px' ;
obj.style.top = theTop + 'px' ;
setTimeout("place_It('layer1')"
,500);
}
window.onscroll = setTimeout
("place_It('layer1')"
,500);
</script> 
<body>
<div id="layer1">
  <span id="close"
  ><a href="javascript:set_visible('layer1')" style=
  
  "text-decoration: none">
  <strong>Close</strong></a></span>
  <p>Java Script was developed by the Brendan Eich of Netscape. 
  Initially java script was called Live script. Live script 
  was the official name of java script
  when it was released in beta version
   in  Netscape Navigator 2.
  
  0 in 1995.
  
  
  But it was renamed by joint procession of Sun Microsystems and Netscape .</p>
</div>
  <input type=
  "button" value="Open popup"
   onclick=
  "set_visible('layer1')">
 </body>
 
 
 </html>

Style Code:

<style type="text/css">
  #layer1 {
	position: absolute;
	visibility: hidden;
	width: 300px;
	height: 300px;
	left: 20px;
	top: 300px;
	background-color: #ccc;
	border: 2px solid #000;
	padding: 10px;
}

#close {
	float: right;
}

Step 2. Run the Application.

Previous Home Next