AUTO CLOSE INACTIVE POPUP JAVA SCRIPT

Bookmark and Share
Step by Step how to install java script effect for auto close inactive popup , you can follow instruction as below to implement in your website or blog :

<!-- FIVE STEPS TO INSTALL AUTO CLOSE INACTIVE POPUP:

  1.  Copy the coding into the HEAD of your HTML document
  2.  Add the onLoad event handler into the BODY tag
  3.  Put the last coding into the BODY of your HTML document
  4.  Create a new HTML file with the code below
  5.  Create a new HTML file with the code below  -->

<!-- STEP ONE: Paste this code into the HEAD of your HTML document  -->

<HEAD>

<SCRIPT LANGUAGE="JavaScript">

<!-- Begin
var TimeOut = 30;    // Initial time to Close window after __ number of seconds?
var TimeRemain = 0;  // Remaining time to Close window after __ number of seconds?
var RefreshRate = 2; // Check to close window every __ number of seconds?
var ChildWin = null;
function TimedPopup(url)
{
 windowprops = "left=250,top=250,width=200,height=200"; // May be adjusted according to your needs
 if (ChildWin)
     return false;
 ChildWin = window.open(url, "ChildWin", windowprops);
 ResetTimer();
 if (TimeOut && RefreshRate)
    setTimeout("CheckClose();",RefreshRate * 1000);
}
function ResetTimer()
{
 TimeRemain = TimeOut;
 document.form1.field1.value = TimeRemain; // For demo purposes only (May be removed)
}
function CheckClose()
{
 TimeRemain -= (RefreshRate);
 if (TimeRemain > 0)
    {
    if (ChildWin && ChildWin.closed)
       {
    document.form1.field1.value = TimeOut; // For demo purposes only (May be removed)
    ChildWin = null;
       }
    else
    if (ChildWin)
       {
        document.form1.field1.value = TimeRemain; // For demo purposes only (May be removed)
    setTimeout("CheckClose();",RefreshRate * 1000);
       }
    }
 else
 if (ChildWin)
    {
     document.form1.field1.value = TimeOut; // For demo purposes only (May be removed)
     if (ChildWin.closed)
     ChildWin = null;
     else
    {
         ChildWin.close();
     ChildWin = null;
        }
    }
}
//  End -->
</script>

</HEAD>

<!-- STEP TWO: Insert the onLoad event handler into your BODY tag  -->

<BODY onUnload="if (ChildWin){ChildWin.close()};">

<!-- STEP THREE: Copy this code into the BODY of your HTML document  -->

<div align="center">

<form name="form1" method="post" action="">
  <input type="button" name="Submit" value="Show Popup" onClick="TimedPopup('autoclose-inactive-popup2.htm');">
  <br><br>
  Time Remaining: <input type="text" name="field1" value="30" size="4">
</form>

</div>


<!-- STEP FOUR: Paste this code into a new HTML document  -->
<!-- Be sure it matches the name in line two of the form above after 'onClick='  -->

<html>
<head>
<title>JavaScript Example</title>
</head>

<SCRIPT LANGUAGE="JavaScript">

<!-- Begin
if (window.opener)
    window.opener.ResetTimer();
//  End -->
</script>

<body>
Page 2
<p>
If you click on "Next Page", the timer will be reset.
<p>
<a href="autoclose-inactive-popup3.htm">Next Page </a>
</body>
</html>


<!-- STEP FIVE: Paste this code into a new HTML document  -->
<!-- Be sure it matches the name in line two of the form above after 'onClick='  -->

<html>
<head>
<title>JavaScript Example</title>
</head>

<SCRIPT LANGUAGE="JavaScript">

<!-- Begin
if (window.opener)
    window.opener.ResetTimer();
//  End -->
</script>

<body bgcolor="#FFFFFF" text="#000000">
Page 3
<p>
If you click on "Next Page", the timer will be reset.
<p>
<a href="popup2.htm">Next Page </a>
</body>
</html>


<!-- Script Size:  4.20 KB -->

{ 0 comments... Views All / Send Comment! }

Post a Comment