[Solved] Highlight image regions on hover with CSS

by


They use sprite image look here.

Basically, it works like that:

  1. The map with dark-blue regions is completely static.
  2. There is invisible layer on top of it made from small rectangular in their case <a> — each corresponds to single dark-blue region and posses its its own id.
  3. When cursor is placed over a rectangular with id x the sprite image is nicely aligned with its background (by setting CSS’s background-position).

Do not think, this magic would be possible without using JavaScript.

1

solved Highlight image regions on hover with CSS