Use of Ajax HoverMenuExtender as Tooltip

How we can make custom tooltip using Ajax HoverMenuExtender ....

<ajaxControls:HoverMenuExtender ID="HoverMenuExtender1" runat="server" TargetControlID="ImgBtn1" PopupControlID="pnl_Hover_Details" PopupPosition="Right" OffsetX="0" OffsetY="0" PopDelay="0"> </ajaxControls:HoverMenuExtender>

<asp:Panel ID="pnl_Hover_Details" runat="server" Width="150px" Height="50px" BackColor="#CCFF99" BorderColor="#999999" BorderStyle="Solid" BorderWidth="1pt">
  <div style="width: 150px; height: 50px">
      Details are as follow...  </div>
</asp:Panel>

Update Progress Bar over the web page

Get the Progress Bar over the controls of the page,while the processing is going on....

 <asp:UpdateProgress ID="UpdateProgress1" runat="server" AssociatedUpdatePanelID="Updatepanel1">
<ProgressTemplate>
<div id="progressBackgroundFilter">
</div>
<div id="processMessage">
<img alt="Loading" src="../Images/processingbar.gif" />
</div>
</ProgressTemplate>
</asp:UpdateProgress>

Style Sheet:

#progressBackgroundFilter
{position: fixed;
top: 0px;
bottom: 0px;
left: 0px;
right: 0px;
overflow: hidden;
padding: 0;
margin: 0;
background-color: #000000;
filter: alpha(opacity=70);
opacity: 0.5;
z-index: 1000;
}
 #processMessage
{
position: fixed;
top: 48%;
left: 42%;
z-index: 1001;
background-color: #000;
filter: alpha(opacity=50);
opacity: 0.5;
color:#fff;
font-size: 14px;
font-weight:bold;
width: 0mm;
height: 0mm;
text-align:center;
}