Other Properties & Uses
Moving on... Other objects have properties too. Like the page's background color. In HTML, the attribute for the background color is background-color, but in JavaScript, it is backgroundColor. (Notice the lack of a hyphen and the capitalization.)
To create a link that will change the window's background color using an onMouseOver event, I'll have to think this through:
- Since this is a link, I should be able to use the same format as the format in my earlier script. I'll copy that code.
- Am I changing the window or the document? What does the backgroundColor command affect when I write it to a webpage? It isn't the window, so it must be the document. Document is the object here. I'll change window in the copied code to document.
- I want to change the object's background, so I'll change status to backgroundColor. Shit, ran into a problem here. It works if I use bgColor instead. * See note at the bottom.
- I no longer want that "Go to the Goodies Home Page" to appear, so I'll replace that phrase with the name of the color which I want the background to be. I'll use pink.
- When the cursor moves over the link, I want the color to stay whether the mouse rolls over the link again or not, so I need that return true code after the semicolon.
HTML file: |
Displayed by browser: |
<body>
<A HREF="http://www.htmlgoodies.com" target="_blank" onMouseOver="document.bgColor='pink';
return true">Click Here</A>
</body>
|
Click Here
|