Home Javascript JavaScript createPopup method
Questions:Ask|Latest

 
 

Share on Google+Share on Google+

JavaScript createPopup method

Advertisement
In our this part of JavaScript methods we will describe you how you can create a popup window by using the simple JavaScript in an HTML page.

JavaScript createPopup method

     

In our this part of JavaScript methods we will describe you how you can create a popup window by using the simple JavaScript in an HTML page. We have used here the createPopup() method of JavaScripts to create the popup window.

Syntax: 

 window.createPopup();

Description of code:

In the following example code we have created a simple html page and we have added a simple button in this html page. On the button we have applied the javascript's code for the visual appearance of the Popup window. As soon as we carry our mouse pointer over the button it calls the popup.show() and on mouse pointer out it will hide the popup window.  Here is the full example code of poppedexample.html as follows:

poppedexample.html

<html>
 <head>
  <title>PopUp example</title>
    <script language="JavaScript">
	function write(){
		document.write("Button clicked");
	}
		var popup = window.createPopup();
		popup.document.body.innerHTML = 'Popup button';
		popup.document.body.style.backgroundColor =
               '#ffffcc';
    </script>
  </head>
    <body>
      <br>
        <input type="button" onClick="write();"
          onmouseover="popup.show(0, 0, 200, 50, document.body);" 
          onmouseout="popup.hide();" 
          value="Simple Button">
    </body>
</html>

Output :

When you will take your mouse pointer on the button "Simple Button" it will show the pop up box over the button. It will look like as follows:

Download Source Code

     

Advertisements

If you enjoyed this post then why not add us on Google+? Add us to your Circles



Liked it!  Share this Tutorial


Follow us on Twitter, or add us on Facebook or Google Plus to keep you updated with the recent trends of Java and other open source platforms.

Posted on: January 29, 2009

Related Tutorials

Ask Questions?    Discuss: JavaScript createPopup method   View All Comments

Post your Comment


Your Name (*) :
Your Email :
Subject (*):
Your Comment (*):
  Reload Image
 
 
Comments
DMCA.com