It puzzled me at first, because it wasn't text since you couldn't select the letters, and it didn't act like an image (you couldn't drag the image elsewhere).
Here's his nav bar:
http://orderedlist.com/images/nav.gif
And here's the relevant code:
#header ul {width:544px; height:30px; top:35px; right:0; list-style-type:none; background:url(../images/nav.gif) no-repeat; position:absolute;}
#header li {float:left;}
#header ul a {position:absolute; height:30px; top:0; text-indent:-9999px; overflow:hidden; background:url(../images/nav.gif) no-repeat top left;}
#header #hom a {width:53px; left:0; background-position:0 0;}
#header #art a {width:73px; left:53px; background-position:-53px 0;}
#header #por a {width:87px; left:126px; background-position:-126px 0;}
...
#header #hom a:hover {background-position:0 -30px;}
#header #art a:hover {background-position:-53px -30px;}
#header #por a:hover {background-position:-126px -30px;}
...
#body_hom #header #hom a {background-position:0 -60px;}
#body_art #header #art a {background-position:-53px -60px;}
#body_por #header #por a {background-position:-126px -60px;}
...
So essentially, when you hover over it, it'll change the background position to a -30px, which would load the "hilighted" words. Spiffy.
