|
|
Home » Javascript » Article
Javascript Pop Up Window
|
| Article by: |  Jeff Anderson ( 1362 ) (3/14/2002) |
|
| Summary: | Create a customisable pop up window when a user clicks the link. |
|
| Viewed: 55465 times |
Rating (25 votes): |
|
4.3 out of 5 |
|
|
|
If you want to create a pop up window when a user clicks the link here is the code!
Paste the javascript below into the <head>
tag of your page
<script language="javascript">
function PopUp(ref)
{
var strFeatures="toolbar=no,status=no,menubar=no,location=no"
strFeatures=strFeatures+",scrollbars=yes,resizable=yes,height=320,width=500"
newWin = window.open(ref,"TellObj",strFeatures);
newWin.opener = top;
}
</script>
| |
|
You can change any of the window features by altering the various paramater. Try altering the height or width, and the various scroll and status bars (yes and no being the choice in most cases here).
Now all you need to do is create the pop up page itself, and link to it.
The link is not the usual <a href="page.htm">Link Text</a>, but a call to our pop up function, passing the
page as a parameter:
<a href="javascript:PopUp('page.htm')">Link Text</a>
| |
|
As usual with javascript, don't forget the function name is case sensitive and will not work if you use the wrong case.
|
|
View highlighted Comments
 User Comments on 'Javascript Pop Up Window'
|
Posted by :
 Archive Import (Thomas Williams) at 19:34 on Saturday, October 26, 2002
|
I do not understand this at all I am teying to put a ddraw.dll file in my computer. It is asking me to put a javascript and a pop up window on my computer.If you know how to put a ddraw.dll file in my computer system let me know.
| |
|
Posted by :
Archive Import (jo) at 16:21 on Saturday, November 30, 2002
|
have been looking for this code everywhere! ty ty
| |
|
Posted by :
Archive Import (Paco Artacho) at 07:49 on Wednesday, July 30, 2003
|
I have used the Pop Up Windows and works really fine.
Only I've got a question:
How to control the position of the Pop Up windows in the screen?. Is that possible?
| |
Posted by :
 kingbiged at 15:57 on Thursday, October 23, 2003
|
[quote] How to control the position of the Pop Up windows in the screen?. Is that possible? [/quote]
Is there a solution to this yet? I love this javascript, but am having trouble with where the pop-ups are apearing.
| |
|
Posted by :
lrumley at 12:23 on Wednesday, December 10, 2003
|
you can control where the popup window shows up with the parameters 'left' and 'top'
for example:
<script language="javascript">
function PopUp(ref)
{
var strFeatures="toolbar=no,status=no,menubar=no,location=no"
strFeatures=strFeatures+",scrollbars=yes,resizable=yes,height=320,width=500"
// ADDED THE LINE BELOW TO ORIGINAL EXAMPLE
strFeatures=strFeatures+",left=150,top=250"
newWin = window.open(ref,"TellObj",strFeatures);
newWin.opener = top;
}
</script>
this will load the window 150 pixels from the left of the screen and 250 pixels from the top...hope it helps
| |
|
Posted by :
artaco2000 at 15:43 on Wednesday, July 06, 2005
|
Excellent article. I want to use this code to open several windows in the same page, depending upon which link the user clicks on. The parameter ref is the name of the windows, but what is the parameter TellObj?
| |
|
Posted by :
maguidhir at 15:56 on Thursday, September 08, 2005
|
I was also wondering what the parameter TellObj is?
I'm trying to do exactly what you're doing here, except that I am passing parameters through the querystring and it's not working.
| |
|
Posted by :
rudra at 23:50 on Tuesday, December 04, 2007
|
I have a textbox in HTML.
I will put a value in the textbox and click on submit.
On clik of submit, a popup window will open.
I want the name of the heading of the popup winow will be same as the text i have entered in the textbox.
how to do that?
| |
|
To post comments you need to become a member. If you are already a member, please log in .
 
| RELATED ARTICLES |
Javascript - Enable and Disable form elements
by Jeff Anderson
This is a relatively little known and under-used feature of javascript which can be very useful in guiding a user through a form. Using the disabled tag, you can switch on and off elements in a form. |
 |
Check IsNumeric Function
by Jeff Anderson
A javascript validation function to check whether the details entered by a user are numeric. |
|
Javascript Onload Event
by Jeff Anderson
Sometimes you need to perform an action immediatley after the page has loaded. That's when the onLoad Event Handler comes in handy |
|
Form Validation Function
by Jeff Anderson
A javascript validation function that you can use to validate all types of forms. |
|
JavaScript Field Is Empty Form Validation
by Jeff Anderson
This javascript function allows you to check whether a form field has been completed or not. |
|
Javascript Get Selected Text
by Jeff Anderson
A cross-browser script to get text selected by the user |
|
Check Email Validation Function
by Jeff Anderson
A javascript validation function to check whether the user has entered a valid email address in a form. |
|
Multiple submit buttons on a single form
by Kiran Pai
This script shows you how to submit the contents of a form to different programs depending on which Submit button you press. Additionally it also shows how to call two different functions when you press the Submit button. |
|
Javascript onUnload Event Handler
by Jeff Anderson
The onUnload Event Handler allows you to perform an action as the user leaves the page. |
|
Validate Form and Disable Submit Button
by Marylou Marks
I have a form that validates info, but I also want to disable the submit button. The disable part worked before adding the form validating. |
|
| |
