Sample: Dynamic Status Text on Hover

Demonstration:

Table of Contents

  1. Chapter 1: From Humble Beginnings
  2. Chapter 2: The Establishment of the Republic
  3. Chapter 3: A Taste for Empire
  4. Chapter 4: The Punic Wars
  5. Chapter 5: The Pupil Overcomes the Master
Hover over chapters to view descriptions..
How a small village on the Tiber achieved dominion over the Mediterranean
The overthrow of the monarchy and the role of the census in jump-starting a new form of government
The Conquest of Italy and Sicily
Hannibal and The Fall of Carthage
The Conquest of Greece and the Stability of the Roman System

Description:

Slightly similar feature to the previous master/detail sample, but with a different design. The main apparent variation is that a hover now triggers the event instead of a click.

But the technique here is different. We're not really using visibility/display tricks. The target block where the description appears exists on the page at all times. Its content however is dynamically altered. The actual text exists on the page but is hidden. It's grabbed by a script and assigned to the "innerHTML" value of the block.

References

[tbd]