<?xml version="1.0" encoding="ISO-8859-1"?>
<public:component xmlns:public="urn:HTMLComponent" lightweight="true">

<!-- event handlers - note how undocumented handler parameter
     can be used instead of onevent without () after function -->
<public:attach event="onmouseover" handler="showCaption" />
<public:attach event="onmouseout" handler="hideCaption" />
<public:attach event="onload" for="window" onevent="fnInit()" />
<public:method name="showCaption">
<public:method name="hideCaption">

<script type="text/javascript">
//<![CDATA[
//--------------------------------------------------------------------
//
//  File:         showCaption.htc
//
//  Description:  The show caption rollover behavior provides and easy, 
//                declarative method to show a text caption in a predefined
//                location when hovering over certain elements
//                without the use of script.  
//
//--------------------------------------------------------------------


//------------------------------------------------------------------------
// Setup global variables
//------------------------------------------------------------------------

var captionSpanId = "caption";
var captionImgId = "captionImage";

function fnInit () {
// We run this both at initialization time (i.e. when element is created)
// and on window load in case the caption placeholder did not yet exist
// at init time (the reason we run it at init time is a user can actually
// invoke the behavior (i.e. mouseover) before the document finishes loading)
    var captionImg = window.document.getElementById(captionImgId);
    if (captionImg) {
        // set global variables (in the htc's context):
        showImage = captionImg.getAttribute("hoversrc");
        hideImage = captionImg.src;
    }
}
fnInit();

//------------------------------------------------------------------------
//
//  Function:  showCaption()
//
//  Synopsis:  When the mouse is over the element, set the "caption" to
//             the title of the element (if specified).
//
//------------------------------------------------------------------------

function showCaption()
{
  if (element.title)
  {
    window.document.getElementById(captionSpanId).innerHTML = element.title;
    window.document.getElementById(captionImgId).src = showImage;
  }
}

//------------------------------------------------------------------------
//
//  Function:  hideCaption()
//
//  Synopsis:  When the mouse moves off the element, set the "caption" to 
//             a blank string
//
//------------------------------------------------------------------------

function hideCaption()
{

  window.document.getElementById(captionSpanId).innerHTML = "&nbsp;";
  window.document.getElementById(captionImgId).src = hideImage;
}

//]]>
</script>
</public:component>