Self closing popup window

Self closing popup window is a web page which open in popup and close automatically after serving its purpose. It may be an HTML form which will be closed after successful submission of data. Or it may be an information window which will be closed automatically after a time delay say 10 seconds. In my opinion it is best practice to allow some time delay before self closing window and giving user a link such that he can close it manually.

Demo

How to create popup window:

A popup window can be created with the following JavaScript command,

Code | Download
<script type="text/javascript">
<!--
function popup(){
window.open('popup.php','mypopup','width=300,height=350,toolbar=no,location=no,directories=no,status=yes,menubar=no,scrollbars=yes,copyhistory=yes');}
-->
</script>

This function will open a popup window of width =300px and height = 350px. URL of this popup window is popup.php. Please add this JavaScript code between and tags from where you want to open this popup window. Now put a link <a href="javascript:popup()">Click here to open popup window</a>.

Self closing window php code:

Algorithm of PHP code in popup.php page is as follows:
Check whether user POST data or not.
If user POST data: display an HTML link to close this window. If user does not close it, window will be automatically closed after 5 seconds.
If POST data is empty: display an HTML submit form to accept user data.

Code | Download
<html>
<head>
<script type="text/javascript">
<!--
<?php
if(isset($_POST['name'])&&($_POST['name']!='')){
$name=htmlspecialchars($_POST['name']);
// Display self closing page.
?>
setTimeout("window.close();",5000);
-->
</script>
</head>
<body>
<p>Hello <?php echo $name; ?>!, <a href="javascript:window.close()">Click here</a> to close this window.</p>
<?php
// Display HTML form.
}else{ ?>
function validate(obj){
var l=obj.name.value.length;
if((l>10)||(l<3)){
alert('Message length between 3 to 10 characters.');
return false;}
return true;
}
-->
</script>
</head><body>
<form method="post" action="popup.php" onsubmit="return validate(this)">
Your name: <input type="text" name="name" /><br />
<input type="submit" name="submit" value="submit" />
<?php } ?>
</body>
</html>
User comments:

Popup window once per user

COMMENT BY: veghelth DATE: Jul 10, 04:03
Very nice article. But one question, how to show self-closing popup ad once per user. Is it possible?

Reply: Self closing popup ad

COMMENT BY: admin DATE: Jul 13, 03:20
If you like to ad once per user then you have to set cookie on user computer. I shall publish an article explaining how to read/write cookie with JavaScript.

Please no popup

COMMENT BY: trail DATE: Jul 23, 03:45
Please no popup. I hate to see them. u can achieve nothing from popups.

Add comment

RAMUI WEBBLOG
HomeAboutContact SitemapTerms of useXMLForum
© 2010,  http://ramui.com   All rights reserved.
Powered by: ramui webblog® Version 1.0