Uncle Jim's Web Designs

Changing Inner Text

Author: Jim Stiles

With Dynamic HTML and Internet Explorer 4 and 5 you can update the text on the page after the page is rendered. The trick is to use the ID attribute as a unique identifier for the tag. As the user rolls the cursor over the text, the onmouseover event replaces the text between the opening and closing tags. Here's an example:

Mouseover Me

Here's the code for the above example:
<p id="mytext" onmouseout="mytext.innerText='Mouseover Me';" onmouseover="mytext.innerText='Thanks, now you may remove the mouse.';">Mouseover Me</p>

Here's an example of using it in a sentence to replace words or phrases:

I wish I had a hamburger   to eat.

Here's the code for the above example:
I wish I had a <span id="mytext2" onmouseout="mytext2.innerText='hamburger';" onmouseover="mytext2.innerText='hot dog ';"> hamburger </span> to eat.

Close This Window