Welcome to Bucaro TecHelp!

Bucaro TecHelp
Maintain Your Computer and Use it More Effectively
to Design a Web Site and Make Money on the Web

About Bucaro TecHelp About BTH User Agreement User Agreement Privacy Policy Privacy Site Map Site Map Contact Bucaro TecHelp Contact RSS News Feeds News Feeds

Code for a Less annoying Popup Window

In previous articles I have stated my opinion that it very discourteous and stupid for Webmasters use advertising popup windows on their Web sites. They get paid $0.01 or less to shove a popup window in your face. But in the end that causes them to loose money because people avoid their Web site.

Since then many otherwise courteous and intelligent Webmasters have decided to use popup windows because some moron is claiming they are "effective". Well if you must use popup windows, maybe you will consider using this code for a less annoying popup window.

There are two things that make a popup window annoying. First, it covers the information in the main window that you are trying to see. Second, you have click on it to close it. One click will not break your arm, but the darn things are popping up like flys on donky dung.

The JavaScript code included with this article creates a popup window that displays your adverting on top of the main window for four seconds, then it becomes a pop-under. This is enough time for the user to read a short advertisement without getting too annoyed. You can increase the time if you like, but keep it to a minimum.

After 60 seconds, the popup window closes itself. If the user has not clicked on the popup window within 60 seconds, they are obviously not interested in it, so it closes itself. The popup window also closes when the user closes the page that generated the popup window.

If the user clicks on the popup window before the 60 seconds lapses, the popup window never closes. It stays open because obviously the user is interested in the popup window contents.

You can test that function with this demonstration by reloading this page. (The code for this demonstration closes the popup window after only eight seconds.) After four seconds the example popup window will pop-under. If you click on its icon in your task bar within eight seconds, it will return to the top and stay. But if you donít open the popup window within eight seconds, it closes.

To use this code, paste the indicated JavaScript code into the <head> section of your web page. In your <body> tag, enter the file path of the page that you want to display in the popup window. Also enter a width and height for the popup window as shown below.

<body onLoad="OpenPopUp('popup.htm',600,300)" onUnLoad="ClosePopUp()">

Also paste the indicated JavaScript code into the <head> section of your popup page. In your <body> tag, enter the code for the onFocus event handler as shown below.

<body onFocus="informParent()">

The only problem with this method, is if the user does not finish reading the popup window before it becomes a pop-under. But all the user has to do is click to bring the window back to the top. It is important to use the <title> tag in your popup window, so that the user can find the proper icon on the task bar if they decide to open the window.

Another point of advice, you might want to put some text in the popup window to inform the user that it will self close in four seconds. This will make the popup window seem less annoying.

If you must use popup windows, consider using this code to create a less annoying popup window. You can still present your ad and collect your penny, and your popup window will automatically get out of your users face.

More Java Script Code:
• A Brief Introduction to HTML for JavaScript Programmers
• Code to Add Music to Your Webpage
• Easy Expanding Menu Code
• Prototype Keyword Gives JavaScript Object Oriented Inheritance
• HTML5 Canvas lineCap and lineJoin Attributes
• Easy Fading Text Banner Code
• Easy HTML5 Drag and Drop
• Easy JavaScript Form Design
• HTML5 Canvas Drag-and-Drop
• Easy Code to Add Mouse Trails to Your Webpage

RSS Feed RSS Feed

Follow Stephen Bucaro Follow @Stephen Bucaro

Fire HD
[Site User Agreement] [Privacy Policy] [Site map] [Search This Site] [Contact Form]
Copyright©2001-2018 Bucaro TecHelp 13771 N Fountain Hills Blvd Suite 114-248 Fountain Hills, AZ 85268