Tuesday, September 27, 2022

Advanced JavaScript for Web Developers: onClick and onMouseOver

One of the great things about JavaScript, and why I like it so much, is that it can be quite complicated, such as the hiermenus at the top of this page, or as simple as the many examples in this tutorial. What we’re going to go over here are a certain class of JavaScript functions called “Event Handlers.” These are commands that work directly with existing HTML commands. They work so closely in fact, they work by being embedded right into the HTML command itself.

They’re called Event Handlers because they create events. They do things when your users do things. That’s a terrible description, but I’m on a tight schedule here. Read on…

We’re going to go over a few different Event Handler JavaScript commands here. I’ll list them up front. I want you to keep an eye on the capitalization pattern of each. You must keep that pattern every time you use the command. If you don’t, the commands won’t work. Here are the commands:


  • onMouseOver This creates an event when the mouse is passed over active text or image.
  • onMouseOut This creates an event when the mouse is taken off of an active text image.
  • onClick This creates an event when active text or images are clicked on.
  • alert This pops up a dialogue box that contains text and an OK button.


Popular Articles