Hover Techniques

This example shows how to utilize css hovering Hover the cursor over the day links to see additional content appear View source to see the HTML and CSS being used

CSS Used in this Example

   div.exDiv   {width:90px;}
  a.exLink     {position:relative; color:orange; font-weight:bold;}
  a.exLink span {position:absolute; display:none; text-decoration:none;
                color:black; background-color:yellow; border:5px solid green;
                padding:5px; margin:3px;z-index:5;top:20px; left:15px; width:200px;height:75px;}
  a.exLink:hover span {display:block;}
 

HTML Used in this Example

  <div class="exDiv">
    <a class="exLink" href="#">John F Kennedy
      <span>Ask Not what your country can do for you, ask what you can do 
            for your country
      </span>
    </a>
  </div>

Hover over JFK link to see it working