?
Solved

Multiple timed popup windows

Posted on 2003-04-01
20
Medium Priority
?
359 Views
Last Modified: 2010-04-06
I need to create 3 delayed popup windows with a fourth
one on body unload.

1-  28day.htm
2-  extreme.htm
3-  traffic.htm
on exit = popup.htm

timed intervals of 20 seconds, 60 seconds, 90 seconds

Is this possible?

0
Comment
Question by:sherry52
[X]
Welcome to Experts Exchange

Add your voice to the tech community where 5M+ people just like you are talking about what matters.

  • Help others & share knowledge
  • Earn cash & points
  • Learn & ask questions
  • 10
  • 8
  • 2
20 Comments
 
LVL 53

Expert Comment

by:COBOLdinosaur
ID: 8246740
do the body this way:

<body onLoad="dopopups()" onUnload="openit("popup.htm")>

Then put this script in the head:

<script language="JavaScript">
<!--
   function openit(theurl)
   {
      window.open(theurl,'','');
   }
   
   function dopopups()
   {
      setTimeout('openit("28dat.htm")',20000;
      setTimeout('openit("extreme.htm")'60000;
      setTimeout('openit("traffic.htm")',90000
   }
//-->
</script>

A little caution.  Sticking a lot of popups in the users face generally irritates them and it may reduce the number of return visitors you get.

Cd&
0
 
LVL 5

Expert Comment

by:MMeijer
ID: 8246771

<script type="text/javascript">
//<![CDATA[
function window.onload()
{
  setTimeout('window.open(\'28day.htm\')',20000);
  setTimeout('window.open(\'extreme.htm\')',60000);
  setTimeout('window.open(\'traffic.htm\')',90000);
}

function window.onunload()
{
    window.open('popup.htm');
}

//]]>
</script>
0
 

Author Comment

by:sherry52
ID: 8248102
I'm new to the boards here and I don't know how to work them.  I needed to tell both people that I couldn't get either script to work.

Problem 1:

I need to define the properties of the new window and I'm not sure how to do that.

Problem 2:

This suggestion may work, but I don't know what
to put in the body to get it started.

<script type="text/javascript">
//<![CDATA[
function window.onload()
{
 setTimeout('window.open(\'28day.htm\')',20000);
 setTimeout('window.open(\'extreme.htm\')',60000);
 setTimeout('window.open(\'traffic.htm\')',90000);
}

function window.onunload()
{
   window.open('popup.htm');
}

//]]>
</script>

Problem 3:

This script:

<body onLoad="dopopups()" onUnload="openit("popup.htm")>

Then put this script in the head:

<script language="JavaScript">
<!--
  function openit(theurl)
  {
     window.open(theurl,'','');
  }
 
  function dopopups()
  {
     setTimeout('openit("28dat.htm")',20000;
     setTimeout('openit("extreme.htm")'60000;
     setTimeout('openit("traffic.htm")',90000
  }
//-->
</script>

Didn't work for me.  I need to understand what the
timing figures represent and I need to know whether
to do this:

 window.open(theurl,'28day.htm',extreme.htm','traffic.htm');

I know popups are annoying, but my client wants them.

Thanks for your help.
0
WordPress Tutorial 4: Recommended Plugins

Now that you have WordPress installed, understand the interface, and know how to install new parts, let’s take a look at our recommended plugins.

 
LVL 5

Expert Comment

by:MMeijer
ID: 8248197
<script type="text/javascript">
//<![CDATA[
var strProperties = 'width=400,height=400,top=100,left=100,fullscreen=0,toolbar=0,resizable=0,location=0,scrollbars=0';
function window.onload()
{
 setTimeout('window.open(\'28day.htm\',\'\',strProperties)',20000);
 setTimeout('window.open(\'extreme.htm\',\'\',strProperties)',60000);
 setTimeout('window.open(\'traffic.htm\',\'\',strProperties)',90000);
}

function window.onunload()
{
   window.open('popup.htm',\'\',strProperties);
}

//]]>
</script>
0
 
LVL 53

Accepted Solution

by:
COBOLdinosaur earned 2000 total points
ID: 8248571
OOps I left out the closing parenthesis. There are three arguments to the window open.  The first is the url for the page like '28day.htm'.  The second is the title which you can send across as null with '' and the final one is a string containing the property setting for the new window.
The setTimeout method has two properties.  the command to be executed, and the amount of time to wait before executing the command.  the time amount is express in milliseconds.  Therefore 20000 is 20 seconds.
This is what a complete page might look like using what I posted:
<html>
<head> <title> Just a Page</title>
<script language="JavaScript">
<!--
var chrome= 'width=300,height=300,top=150,left=100,fullscreen=0,toolbar=0,resizable=0,location=0,scrollbars=0';

function openit(theurl)
{
window.open(theurl,'',chrome);
}

function dopopups()
{
setTimeout('openit("28dat.htm")',20000);
setTimeout('openit("extreme.htm")',60000);
setTimeout('openit("traffic.htm")',90000);
}
//-->
</script>
</head>

<body onLoad="dopopups()" onUnload="openit('popup.htm')">

mainpage content here
</body>
</html>

Cd&
0
 

Author Comment

by:sherry52
ID: 8250448
This worked so slick now...thank you for helping me with this.  Now I need to fix my popups to be the same size, unless there is a way to get them to size automatically to the table in the page.

What do these points do anyway?  I'm glad I got this resolved today.

0
 
LVL 53

Expert Comment

by:COBOLdinosaur
ID: 8253950
You can control the height and width on the open.  Just set up a different properties string for each one then do it this way:

script language="JavaScript">
<!--
script language="JavaScript">
<!--
var chrome= '';
var chromea= 'width=325,height=300,top=150,left=100,fullscreen=0,toolbar=0,resizable=0,location=0,scrollbars=0';
var chromeb= 'width=300,height=310,top=150,left=100,fullscreen=0,toolbar=0,resizable=0,location=0,scrollbars=0';
var chromec= 'width=330,height=320,top=150,left=100,fullscreen=0,toolbar=0,resizable=0,location=0,scrollbars=0';
var chromed= 'width=400,height=330,top=150,left=100,fullscreen=0,toolbar=0,resizable=0,location=0,scrollbars=0';

function openit(theurl)
{
window.open(theurl,'',chrome);
}

function dopopups()
{
chrome = chromea;
setTimeout('openit("28dat.htm")',20000);
chrome = chromeb;
setTimeout('openit("extreme.htm")',60000);
chrome = chromec;
setTimeout('openit("traffic.htm")',90000);
}
//-->
</script>


function openit(theurl)
{
window.open(theurl,'',chrome);
}

function dopopups()
{
setTimeout('openit("28dat.htm")',20000);
setTimeout('openit("extreme.htm")',60000);
setTimeout('openit("traffic.htm")',90000);
}
//-->
</script>

body onLoad="dopopups()" onUnload="chrome=chromed; openit('popup.htm')">

Glad we could help. Thanks for the A. :^)

BTW the points have no value except to keep score and determine ratings.

Cd&
0
 

Author Comment

by:sherry52
ID: 8270993
This has worked.  I just heard from my client last night that now he wants the multiple popups to appear on unload.

Is there a way to do that?

He wants the popup.htm to be the only one that appears on the index.htm page.  Then the 3 to appear on exit.

Sorry for this...
0
 
LVL 53

Expert Comment

by:COBOLdinosaur
ID: 8271234
Just fire the open without a timeout in the onunload, but there is no guarantee they will all fire because if the user is going to another site, the load of the ne page may prevent the additional opens from firing.

Also please tell your client there is only one thing worse than popups, and that is popups when someone is trying to leave.  The technique is most commonly used by porno sites, and the techniques and the content belong together.

When I am browsing: A popup causes irritation.  A second popup gets the site on my list of sites to never visit again, and any addition popups gets the site blocked at the firewall.

Cd&
0
 

Author Comment

by:sherry52
ID: 8271401
I agree with you...I'm going to try to talk him out of this.  These MLMers get carried away..

Thanks for your help.
0
 

Author Comment

by:sherry52
ID: 8285363
I can't seem to get the first popup box any wider than the rest of the boxes.

I need the 28day.htm to be about 500, but even if I change it to 700, there is no difference in the window.

Any ideas?

This is what I've been using:

<script language="JavaScript">
<!--
var chrome= '';
var chromea= 'width=700,height=300,top=150,left=100,fullscreen=0,toolbar=0,resizable=0,location=0,scrollbars=0';
var chromeb= 'width=300,height=350,top=150,left=100,fullscreen=0,toolbar=0,resizable=0,location=0,scrollbars=0';
var chromec= 'width=330,height=340,top=150,left=100,fullscreen=0,toolbar=0,resizable=0,location=0,scrollbars=0';
var chromed= 'width=520,height=430,top=150,left=100,fullscreen=0,toolbar=0,resizable=0,location=0,scrollbars=0';

function openit(theurl)
{
window.open(theurl,'',chrome);
}

function dopopups()
{
chrome = chromea;
setTimeout('openit("28day.htm")',60000);
chrome = chromeb;
setTimeout('openit("extreme.htm")',120000);
chrome = chromec;
setTimeout('openit("traffic.htm")',180000);
}
//-->
</script>



0
 
LVL 53

Expert Comment

by:COBOLdinosaur
ID: 8285628
Oh!  A timing issue. We just need to change where we set it::
<script language="JavaScript">
<!--
var chrome= '';
var chromea= 'width=700,height=300,top=150,left=100,fullscreen=0,toolbar=0,resizable=0,location=0,scrollbars=0';
var chromeb= 'width=300,height=350,top=150,left=100,fullscreen=0,toolbar=0,resizable=0,location=0,scrollbars=0';
var chromec= 'width=330,height=340,top=150,left=100,fullscreen=0,toolbar=0,resizable=0,location=0,scrollbars=0';
var chromed= 'width=520,height=430,top=150,left=100,fullscreen=0,toolbar=0,resizable=0,location=0,scrollbars=0';

function openit(theurl,thechrome)
{
chrome=thechrome;
window.open(theurl,'',chrome);
}

function dopopups()
{
setTimeout('openit("28day.htm",+chromea)',60000);
setTimeout('openit("extreme.htm",+chromeb)',120000);
setTimeout('openit("traffic.htm",+chromec)',180000);
}
//-->
</script>


Cd&
0
 

Author Comment

by:sherry52
ID: 8286043
Whoops...now all the popups are opening in a full screen.
0
 

Author Comment

by:sherry52
ID: 8286310
Whoops...now all the popups are opening in a full screen.
0
 
LVL 53

Expert Comment

by:COBOLdinosaur
ID: 8286718
Oops.  Syntax error.  Should be:

function dopopups()
{
setTimeout('openit("28day.htm",'+chromea+')',60000);
setTimeout('openit("extreme.htm",'+chromeb+')',120000);
setTimeout('openit("traffic.htm",'+chromec+')',180000);
}

Cd&
0
 

Author Comment

by:sherry52
ID: 8287725
I made the changes to this, but the windows are still coming up a full window instead of the sized window.



<script language="JavaScript">
<!--
var chrome= '';
var chromea= 'width=700,height=300,top=150,left=100,fullscreen=0,toolbar=0,resizable=0,location=0,scrollbars=0';
var chromeb= 'width=300,height=350,top=150,left=100,fullscreen=0,toolbar=0,resizable=0,location=0,scrollbars=0';
var chromec= 'width=330,height=340,top=150,left=100,fullscreen=0,toolbar=0,resizable=0,location=0,scrollbars=0';
var chromed= 'width=520,height=430,top=150,left=100,fullscreen=0,toolbar=0,resizable=0,location=0,scrollbars=0';

function openit(theurl,thechrome)
{
chrome=thechrome;
window.open(theurl,'',chrome);
}

function dopopups()
{
setTimeout('openit("28day.htm",'+chromea+')',60000);
setTimeout('openit("extreme.htm",'+chromeb+')',120000);
setTimeout('openit("traffic.htm",'+chromec+')',180000);
}

//-->
</script>
0
 
LVL 53

Expert Comment

by:COBOLdinosaur
ID: 8287881
Okay let's try another approach:
script language="JavaScript">
<!--
var chrome= '';
chromearr= new Array(4);
chromearr[0]= 'width=700,height=300,top=150,left=100,fullscreen=0,toolbar=0,resizable=0,location=0,scrollbars=0';
chromearr[1]= 'width=300,height=350,top=150,left=100,fullscreen=0,toolbar=0,resizable=0,location=0,scrollbars=0';
chromearr[2]= 'width=330,height=340,top=150,left=100,fullscreen=0,toolbar=0,resizable=0,location=0,scrollbars=0';
chromearr[3] 'width=520,height=430,top=150,left=100,fullscreen=0,toolbar=0,resizable=0,location=0,scrollbars=0';

function openit(theurl,thechrome)
{
chrome=chromearr[thechrome];
window.open(theurl,'',chrome);
}

function dopopups()
{
setTimeout('openit("28day.htm",0)',60000);
setTimeout('openit("extreme.htm",1)',120000);
setTimeout('openit("traffic.htm",2)',180000);
}

//-->
</script>

Cd&
0
 

Author Comment

by:sherry52
ID: 8288260
I wasn't sure what to put in the body tag.

<body background="images/moneydblue.jpg" onLoad="dopopups()" onUnload="chrome=chromed; openit('popup.htm')">
I tried your above script, but nothing happened because of the body tag error.
0
 
LVL 53

Expert Comment

by:COBOLdinosaur
ID: 8292860
I've got it working in this page:

<html><head><title>none</title>
<script language="JavaScript">
<!--
var chrome= '';
chromearr= new Array(4);
chromearr[0]= 'width=700,height=300,top=150,left=100,fullscreen=0,toolbar=0,resizable=0,location=0,scrollbars=0';
chromearr[1]= 'width=300,height=350,top=150,left=100,fullscreen=0,toolbar=0,resizable=0,location=0,scrollbars=0';
chromearr[2]= 'width=330,height=340,top=150,left=100,fullscreen=0,toolbar=0,resizable=0,location=0,scrollbars=0';
chromearr[3]= 'width=520,height=430,top=150,left=100,fullscreen=0,toolbar=0,resizable=0,location=0,scrollbars=0';

function openit(theurl,thechrome)
{
chrome=chromearr[thechrome];
window.open(theurl,'',chrome);
}

function dopopups()
{
setTimeout('openit("28day.htm",0)',60000);
setTimeout('openit("extreme.htm",1)',120000);
setTimeout('openit("traffic.htm",2)',180000);
}

//-->
</script>

<body background="images/moneydblue.jpg" onLoad="dopopups()" onUnload="openit('popup.htm',3)">
content goes here
</body>
</html>
0
 

Author Comment

by:sherry52
ID: 8296633
This worked!!!!

Thank you soooo much....

0

Featured Post

Don't Cry: How Liquid Web is Ensuring Security

WannaCry is just the start. Read how Liquid Web is protecting itself and its customers against new threats.

Question has a verified solution.

If you are experiencing a similar issue, please ask a related question

What is Node.js? Node.js is a server side scripting language much like PHP or ASP but is used to implement the complete package of HTTP webserver and application framework. The difference is that Node.js’s execution engine is asynchronous and event…
SASS allows you to treat your CSS code in a more OOP way. Let's have a look on how you can structure your code in order for it to be easily maintained and reused.
Explain concepts important to validation of email addresses with regular expressions. Applies to most languages/tools that uses regular expressions. Consider email address RFCs: Look at HTML5 form input element (with type=email) regex pattern: T…
The viewer will learn the basics of jQuery including how to code hide show and toggles. Reference your jQuery libraries: (CODE) Include your new external js/jQuery file: (CODE) Write your first lines of code to setup your site for jQuery…
Suggested Courses

765 members asked questions and received personalized solutions in the past 7 days.

Join the community of 500,000 technology professionals and ask your questions.

Join & Ask a Question