Don't miss an insight. Subscribe to Techopedia for free.



What Does Rollover Mean?

Rollover is a JavaScript technique used by Web developers to produce an effect in which the appearance of a graphical image changes when the user rolls the mouse pointer over it. Rollover also refers to a button on a Web page that allows interactivity between the user and the Web page. It causes the button to react by either replacing the source image at the button with another image or redirecting it to a different Web page.


Rollover is triggered when the mouse moves over the primary image, causing the secondary image to appear. The primary image reappears when the mouse is moved away.

Occasionally, rollover is referred to as synonym for mouseover.

Techopedia Explains Rollover

Rollover can be accomplished using text, buttons or images, which can be made to appear when the mouse is rolled over an image. The user needs two images/buttons to perform rollover action.

An imagery rollover can be done with the help of a program with a scripting code or a tool that supports the rollover technique.

Some of the key features of rollover include:

  • Enables interaction between the user and the Web page
  • Makes an image appear or disappear when the mouse is moved over it
  • Makes a hidden image or element to appear when the mouse is moved over it
  • Makes an element of the page change the color of the entire Web page when the mouse is moved over it
  • Causes text to pop up or become highlighted with bold colors when the mouse is moved on a text element.

Related Terms