Personal Web Pages

  1. Home
  2. Computing & Technology
  3. Personal Web Pages

Mouseover Code

Make Your Graphics Change

By Linda Roeder, About.com

These JavaScript templates were found by me for you to use. Just highlight the whole template, copy it and paste it into your text editor or Web page editor.

Make your graphics change when someone moves their mouse over them. Add this simple JavaScript to your code, choose your graphics and add this feature to your Web pages.

1. Where you see graphics/ you need to change to the location of the file where you keep your graphics on your server.

2. Change graphics/about.jpg to the location and name of your main graphic.

3. You will need 2 graphics. One with the main name (ie. about.jpg) and the other with _ov added to it (ie. about_ov.jpg).

4. Where you see the word about in this script you will need to change to the name of your graphic.

Copy This Code to Your Web Page

See What The Page Looks Like

More Templates

Linda Roeder
Guide since 1998

Linda Roeder
Personal Web Pages Guide

Explore Personal Web Pages

About.com Special Features

Build Your Own Website

Step-by-step advice on how to do everything from choosing a Web host to promoting your content. More >

Connect Your Home Computers

Easy ways to connect two computers for networking purposes. More >

Personal Web Pages

  1. Home
  2. Computing & Technology
  3. Personal Web Pages
  4. Templates, Scripts, Hacks
  5. Scripts: Free Copy & Paste
  6. Mouseover Code - Copy and Paste Code Template for Web Pages

©2009 About.com, a part of The New York Times Company.

All rights reserved.