Basic Hovercard

HTML

<div id="images">
    <li>
        
        <div class="hovercard">
            <h3>This is a title</h3>
            <p>This is some description. This is some description. This is some description. This is some description. This is some description. <a href="">This is some link.</a></p>
        </div>    
        
        <img src="http://i00.i.aliimg.com/photo/391346620/Cotton_Double_Faced_Fabric_50x50_v0.summ.jpg" /></li><!-- for some reason when you include em, the div gets shortened -->
    <li>
        
        <div class="hovercard">
            <h3>This is some title</h3>
            <p>This is some description. This is some description. This is some description. This is some description. This is some description. <a href="">This is some link.</a></p>
        </div>
        
        <img src="http://i00.i.aliimg.com/photo/391346620/Cotton_Double_Faced_Fabric_50x50_v0.summ.jpg" /></li>
    <li><div class="hovercard">This is some hovercard fda fda fda f!</div><img src="http://i00.i.aliimg.com/photo/391346620/Cotton_Double_Faced_Fabric_50x50_v0.summ.jpg" /></li>
    <li><div class="hovercard">This is some hovercard!</div><img src="http://i00.i.aliimg.com/photo/391346620/Cotton_Double_Faced_Fabric_50x50_v0.summ.jpg" /></li>
</div>

CSS

#images {
    margin-top: 100px;
}

#images li {
    list-style: none;
    margin-left: 10px;
    position: relative;
    float: left
}

.hovercard {
    color: #FFF;
    clear: both;
    float: none;
    width: 200px;
    background: #000;
    font: 11px Arial, Helvetica, sans-serif;
    -moz-border-radius: 5px;
    border-radius: 5px;
    -webkit-border-radius: 5px;
    position: absolute;
    top: 110px;
    border: 2px solid #999;
    display: none;
}

JavaScript

$('.hovercard').hover(function() {
    $(this).stop(true, false).show();
}, function() {
    $('.hovercard').hide();
});
$('#images li').hover(function() {
    $(this).find('.hovercard').delay(100).fadeIn(); // show() doesn't seem to work with delay
}, function() {
    $(this).find('.hovercard').delay(100).fadeOut('fast');
});