Can't find what you need? Try....Google
  
 
 
 
 
Tutorial on how to make a new pop-up navigation window appear and the way you want it by using simple JavaScript   

Opening Windows
with JavaScript
By Matt Doyle

One of the most useful (and quite possibly the most abused) features of JavaScript is its ability to manipulate browser windows.

It can be very handy for creating a pop-up navigation window, or for making snappy websites with no menus or button bars (see one of our pagekits, filmstar, example.

 


Multiple pop-up windows can be a real pain, especially now that certain free web space companies are getting in on the act as a method of advertising, so go easy on them. A good rule of thumb is: if you're opening two new windows, you're opening one too many!

What does a pop-up window look like?

Click here...

Splendid! How can I make one?
It's really simple. Here's the function that made that window appear:
 

 
 
eMail CRM Freeware I recommend it. It maximize the life-time value of my customers--Quick Tour
emails Art of eMail CRM How to apply minimum efforts for maximum result
at the shortest time?
eMail Bolts & Nuts Interesting emails stuff that you should  know eMail Broadcasting
eMail Marketing Tips Great email marketing strategies and ideas to help you increase sales
Sun Tzu Free eBook Sun Tzu Art of War Leaders without thoughtful strategy invite defeat.
Useful Web Sites
Freeware, shareware tools to help you speed-up your Internet connection
Guest Book  |  Minute Wisdom
Filled with stolen moments, lost dreams, and too many 'if only'
 
 
 
function openWinBoo()
{
          NewWindow=window.open('boo.html', 'boo',
          'width=180,height=50');
}

This creates a new window called "boo", which displays the HTML page "boo.html", and is 180 pixels wide and 50 pixels high.

The function openWinBoo() is called when you click on the link above. The code for the link looks like this:

Click <a href="javascript:openWinBoo()">here</a>

The javascript: bit tells the browser to call a JavaScript function - in this case, our openWinBoo() function.

Let's take a closer look at our function.
The last argument between the parentheses specifies how our new window will look. In our example, we've just specified the width and height with 'width=180,height=50'. However, there are many properties of the window that are under our control.

Property Meaning
directories The "What's new/what's cool" bar (Netscape only!)
location The box allowing the user to type a URL
menubar The menu bar (File, Edit, etc.)
resizable The user can resize the new window by dragging
scrollbars The new window has scrollbars
toolbar The toolbar (Back, Forward, etc.)

Each of these properties can have the value of yes (the feature will appear in the new window) or no (the new window will have that feature disabled).

An important point to note about these properties is that they mustn't have spaces between them. For example, 'width=180,height=50' will work, but 'width=80, height=50' won't.

For example, this function creates a new window with just the menu and the URL entry box:

function openWinMenuUrl()

 

Mike Enlow
Complimentary
Online Stealth
Marketing eBook

 


100% effective.
I recommend it.

  An easy way
to
stop spam getting
into your PC
Free
2-Try

 

Freeware
eMail
Bounce
manager


"A
valued contribution
that I and the rest of my team sincerely appreciate it. We have checked your software twice and it is good." Alex webmaster@softpicks.net

 
 

 

{
      NewWindow=window.open('menu_url.html', 'menu_url',
      'width=400,height=100,location=yes,menubar=yes');
}

Click here to see it in action.

Now you know how to make a new window appear, and how to make that window look the way you want it. Try playing with different properties in the window.open method and enjoy the power of JavaScript!

The End

That's the end of this tutorial. We hope you found it useful. If you're still stuck and would like further help, check out our online www.elated.com/forums where you can get assistance from members of Elated and other webmasters.

If you would like to offer us feedback on this or any of the tutorials, please visit our www.elated.com/forums. Have fun!

<><><><><><>
About the Author

Matt Doyle works for ELATED.com, who produce a range of great Webmaster resources, including the commercial-quality Website templates available at www.pagekits.com/ 

Other Resources for Pop-Up Windows
If you've tried to find the right JavaScript code to open and manipulate pop-ups, look no further.

Some of the tutorials included will help even novices begin to understand how JavaScript works to make web pages more functional. www.wilsonweb.com/

How to Use Pop-Up Windows
Effectively and Responsibly

Pop-ups can be extremely annoying. But that doesn't mean you shouldn't use them. Here is an article that describes the marketing importance of two kinds of pop-ups:

(1) small windows that open when your customer clicks on a hyperlink, and

(2) small windows that open automatically when a visitor comes to your website. Each has its own marketing value and rules for use... www.wilsonweb.com

 
 
Free Secrets of International Trade
Every thing you wanted to know about International import export
   
Free 2Try e-Book "I am a Japanese international business consultant. I find your International Export Import Guide Manual fantastic and splendid." Tominaga Shintaro, Global Business Management Consultant