Well, you want to add one of those JavaScript alert boxes that come out of nowhere, don't you? Okay, let's begin with the alert box that just tells the viewer something you want them to know. Here's the alert command:
| alert('your choice of text') |
Now, to use it, we'll need to place it inside another command. Let's use one we are familiar with, the onMouseover command. The following script will alert the user that you did not want them trying to click this particular link when they move their mouse over it.
| <A HREF="noplace" onMouseover="alert('Hey! I said not to try clicking this link!')">Don't click this link!</A> |
Give it a try. Move your mouse over the link below:
Yes! Now you can drive your friends insane with a bunch of fake links! Here's what all the commands are doing:
- onMouseover=" "
This tells the browser to execute the command or function inside the double quote marks when the user moves their mouse over the link. - alert('Hey! I said not to try clicking this link!')
Instructs the browser to display the text inside the single quotes in an alert window.
That was nice, but could you make something a little more annoying? Of course! It's called the "alert as soon as you open the page!" alert. Just think, you could tell people stuff before they ever see anything on the page! The trick: placing the alert command inside the <HEAD> </HEAD> tags! You will now get to use the old SCRIPT tags I mentioned a couple of sections ago to set off the JavaScript from the other stuff. Here is the code:
| <HEAD> <TITLE>Cool JavaScripts</TITLE> <SCRIPT language="JavaScript"> <!-- hide from old browsers alert('Welcome to my Web Site!'); //--> </SCRIPT> </HEAD> |
This will display the alert before the page starts loading. When you hit "OK" the page will go on and load normally.
Here's the breakdown:
- <SCRIPT language="JavaScript">
This tag lets the browser know you are using JavaScript commands here. - <!-- hide script from old browsers
This makes sure older browsers don't display your script as text on the page. - alert('Welcome to my Web Site!');
This is your alert. Put your mesage inside the single quotes. Notice the semicolon at the end, this is what separates JavaScript commands. - //-->
Stops hiding the script from old browsers. - </SCRIPT>
Ends the JavaScript commands.
Do you want to try it out? Click on the link to see the alert before the new page.
So, do you want to get carried away? Place several of these alerts inside the SCRIPT tag, following each with a semicolon. The viewer will have to say "OK" to every alert before the page will begin loading. Try it out yourself and see if you go insane. Click the link below!
Want the code that did this? Here you go!
| <HEAD> <TITLE>JavaScript Example 2</TITLE> <SCRIPT language="JavaScript"> <!-- alert('Please Sign My Guestbook, NOW!'); alert('I mean it, NOW!!!'); alert('Did I mention I had a guestbook? Well SIGN IT!'); alert('Oh, remember....THE GUESTBOOK! O.K.?!!'); //--> </SCRIPT> </HEAD> |
So, how about that? Pretty wild, isn't it? You can also use the alert with a button, so that it is not such a surprise. Place the code where you want the button to be on your page. You won't need the SCRIPT tag for this one.
| <FORM> <INPUT type="button" value="Click here to see what I think of YOU!" onClick="alert('You are the greatest person I have ever met!')"> </FORM> |
Give it a try. You'll be glad you did....I think.....
Well, that wraps up this section. Let's Go on to Variables and Functions.
Related Articles
- JavaScript AlertsWell, you want to add one of those JavaScript alert boxes that come out of nowhere, dont you? Okay, lets begin with the alert box that just tells the viewer something you want them to know. Heres the alert command:
- JavaScript Password ProtectionOK, I finally got around to writing the javascript password protection tutorial. You will see the example script here is pretty straightforward, but it is also pretty easy to get around. Ill tell you why and give you links to more secure scripts later in this tutorial.
- JavaScript Confirmation BoxesA javascript confirmation box can be a handy way to give your visitors a choice of whether or not an action is performed. A confirmation box will pop up much like an alert box, but will allow the viewer to press an OK or Cancel button.
- Using Google Alerts to your AdvantageLearn about search engine marketing benefits of using Google Alerts to analyze your rivals strategy and to keep track of your own link popularity.
- The Basics- JavaScript TutorialTo get started with JavaScript, you will want to be able to see the tag that will set a script apart from the HTML. The tags used to begin and end a script are the tags. The opening tag should appear like this
- 4 Powerful Features of Javascript Programming LanguageIn the community of web developers and surfers, Javascript is highly popular as client side scripting language for web browsers. Lets take a look at some of the features of this language.
- Google News - Just another Article Announcer?In Googles recent battle towards becoming an international news center, Ive come to notice that the results delivered from Google News seems like nothing more than the articles we publish everyday. So I ask, doesnt it seem like Google News resembles an article directory of some sorts?
- JavaScript PromptsWell, lets say you wanted to get somebodys name before they saw the page, and then write their name on your page right before their very eyes... Well, you can do this using a javascript prompt. Heres the command:
- Introduction to Javascript for NewbiesJavascript is a client-side programming language whose processing engine is embedded in web browsers like Internet Explorer, Netscape, Firefox, etc. This enables the processing engine to read and interpret web pages that contain the javascript code when browsing
- Form ValidationLearn the different ways of validating your form with Javascript.
