A revolving earth (earthani.gif--64x64) Beaverland Net
JavaScript Made Easy!
 
Japanese Version (japanv.gif--100x36)

Beaverland JavaScript Made Easy logo (javascrx.gif--140x233)

Beaverland Unlisted Slang logo (slangs2.gif--140x260)

Beaverland Historica logo (histbanr.jpg--140x360)

Beaverland Mythology logo (mythbanr.jpg--140x255)

Beaverland Stries logo (stories.jpg--140x276)

Beaverland Webs & Internet Secrets logo (web100.jpg--140x250)

Beaverland Cleopatra Gallery logo (galleryt.gif--177x275)

Beaverland Ciold War Years logo (coldwrbn.jpg--140x320)


onstore.gif (140x93)

beavbook.gif (120x160)

beavcomp.gif (120x160)

beavmovi.gif (120x160)

beavgift.gif (120x160)

beavtrav.gif (120x160)

music.gif (50x50) Beaverland Music
 
How to create a popup window
June 16, 2003

The following code creates a simple popup window.

<SCRIPT language="javascript">
<!--- to hide

function myWindow() {

  myPopup=open("","myWin","Height=200,Width=300")
  myPopup.document.write("This is my Popup window!")
  myPopup.document.close()
  }

//--->
</SCRIPT>

<FORM>
<input type="button"
  value="Click here to pop up a small window!"
  onClick="myWindow()">
</FORM>

Java Bean pointing downward (lookdown.gif--55x68)

As you see, the provider at this site allows any author to use popup windows. However, some providers (especially those who offer free space for site builders) disallow you to use popups.

How come?—you may ask.
They don’t like those popups because of possible advertising revenue. Those providers basically make money by placing AD banners in almost every pages at their sites. If you create a popup window, they have some difficulty in placing those AD banners. But, even if they allow for popups, it is technically possible for those providers to place AD banners in popups.

In any case, if those providers keep on disallowing popups, they will loose their customers in the long run because some other providers allow site builders to use popups.

Here is one of such popup-disallowing sites. Please click this link: TARGET Made Easy! (A new window will pop up. To return to this page, please close the new window.)

Screen with a blank popup window (popup01.jpg--479x384)

You see a popup window, but it has nothing inside, and if you take a close look at the left end of the status bar displayed at the bottom of your screen, you will see a tiny yellow triangular icon that indicates that the page has a JavaScript error.

error icon on the status bar (popup02.jpg--100x60)

What is the status bar?
I can’t see it . . .

If you don’t see one, then click VIEW on the menu bar, you will see the pull-down menu. Then click Status Bar on the menu, and you will see the status bar appear on the bottom-left corner of your screen.

VIEW pulldown menu (popup04.gif--270x278)

error icon on the status bar (popup02.jpg--100x60) When you double-click the tiny yellow icon, you will see the following popup message box:

 

Javascript error message (popup03.gif--438x290)

Access is denied!   Yeeesss! The provider disallows you to use a popup window!

Within a couple of years—I would say—this provide will stop this ungenerous practice. For I know some providers once disallowed site builders to use “jump access”. These days, few providers, if not no providers, remove “jump access” tricks.

The “jump access” allows you to jump to the middle of a page, instead of the top of the page. When you click the above link, it will guide you to the section that explains the creation of the popup window.

How come providers don’t like “jump access”?
Well, if they allows for “jump access”, visitors will skip the top, where the provider usually places an AD banner. This is, the provider cannot make money from the AD banner. If you see the AD banner and click it and then buy something, the provider gets a commission.

How to code the “jump access”

Please visit this page: Jump Access. A new window will pop up. To get back here, please close the new page.

 

Can you place another page
in a popup window?

 

When you click this link, you will see the introduction page to June in a popup window.

 

The above demo is coded as follows:

<script language="javascript">
<!--- to hide

function newWindow(pic) {
  newWin = window.open(pic, 'newWin',
    'scrollbars=yes,status=yes,toolbar=yes,
    menubar=yes,location=yes,width=600,height=400')
  }

//---->
</script>

When you click <a href="javascript:newWindow('june4_en.html')">this link</a>, you will see the introduction page to June in a popup window.

<form>
<input type="button" value="Click this button for the same page!"
  onClick="newWindow('june4_en.html')">
</form>

NOTES

  • Because the third parameter of window.open() is too long, it stretches over two lines so that you can easily see it at a glance. In the actual code, however, this parameter is NOT divided into two lines. Don’t divide it. If you do, it doesn’t work properly. The size of the window might appear quite different from what you have specified.

  • In the first example, you see open(), instead of window.open(). Some smart browsers can handle this simpler notation. However, if you write the code by the book, you have to jot down window.open(). The window means a “window” object in JavaScript. This page is treated as a document object in JavaScript. Most of the JavaScript functions (or methods) work on these objects.

    So, when you write window.open(), your browser interprets this as to “open the window object”. If some dumb browsers come across only open(), they might ask you, “open what?”

    The open() and close() are basic JavaScript functions for the window objects. You can manipulate this window object in so many ways. For more information on this, please visit this page: WINDOW Object Basics.

  • In the top example, you see myPopup.document.close(). This statement does not mean to close the window, but interprets like this:
    Close the page (document) that was created in the window object (myPopup). That is, this statement means to finish writing.
  • myWin is a name for the window object (myPopup) so that you could refer to this object with this name just like “anyName” specified in TARGET="anyName". If you want to know more about TARGET, please visit this page: TARGET Made Easy!

Can you place only a picture,
instead of a page?

Yes, you can according to the book. Take a look at the following example:

Popup window with a picture (popup05.jpg--409x307)

The code is as follows:

<form>
<input type="button" value="Pop up with only a picture!"
  onClick="newWindow('../images/june320.gif')">
</form>

However, you cannot do just that.
“Why not?”—you may ask me.
To see why, please visit this page: Yes, I can see June Adams in a popup window!

 

Chipmunk pointing to the left (chipleft.gif--178x156) Related Links





Rate article:
Excellent Good Neutral Poor Worst

Your Name:
Your Email Address:
Comments:


  Comments
 
What if I leave width and height blank?
    - Lilly who has just come back from Shanghai

Good question! Right over here, I’ll try just that:

The above demo is coded as follows:

<SCRIPT language="javascript">
<!--- to hide

function myWindow2() {
  myPop=open("","myWin2","");
  myPop.document.write("<H1>This is my Popup window!</H1>");
  myPop.document.close();
  }

//--->
</SCRIPT>

<form>
<input type="button" value="Click here!"
  onClick="myWindow2()">
</form>

    - Akira

 
 
Copyright Akira Kato
About this author:
  • Educated both in Canada and Japan
  • Traveled extensively in Europe, Far East, and North America
  • Worked as management consultant, computer systems analyst, college instructor and freelance writer.
Akira Kato

Rock My World movie poster (rock01.jpg--150x221) Wanna see a DVD movie?
Why not buy one at a bargain?

REVIEW: Veteran hack director Sidney J. Furie directs the silly straight-to-video comedy Rock My World. The aging stuffy English aristocrats Lord and Lady Foxley (Peter O'Toole and Joan Plowright) have fallen on hard times, so they loan out the use of their mansion to the American rock band Global Heresy. When the band's bass player mysteriously disappears, Nat (Alicia Silverstone) shows up to replace him. Then the servants don't show up, and the Foxleys are forced to pose and a maid and a butler in their own mansion. The culture class between the conservative English and the reckless Americans is played for comedy, leading to an ending where the power of rock & roll transforms both cultural groups.
~ Andrea LeVasseur, All Movie Guide


Beaverland Forum
Featuring thought-provoking
columns and stories
inserted by FC2 system