AjaxLine

Jonathan Snook writes about the contents overlay with CSS. He writes:
«Here's the problem: you have a container with some content in it like an image along with some initial descriptive text. Then, when users hover their mouse over the container, a hidden container is revealed to present additional information over top of the current information but in a way that retains content from the original container. »

And here's the examples:

HTML

<div class="infobox">
   <img src="http://example.com/path_to_image.jpg">
   <div>Here's what you have.</div>
 
   <div class="more">Here's more of a description of what we have going on here.</div>
</div> 

CSS

.infobox {
        position:relative;
    border:1px solid #000; 
    background-color:#CCC;
    width:73px;
    padding:5px;
    }
.infobox img {
        position:relative;
        z-index:2;
    }
.infobox .more {
        display:none;
    }
.infobox:hover .more {
        display:block;
    position:absolute;
    z-index:1;
    left:-1px;
    top:-1px;
    width:73px;
    padding:78px 5px 5px;
    border:1px solid #900;
    background-color:#FFEFEF;
    }

You can read more at Jonathan Snook site.