Client Class HoverPanel

This class provides easy to use pop up window functionality by calling back to a URL and retrieving the result content directly into a panel. Options allow for easy placement of the window and various simple effects like shadows and opacity of the window.

Note that this class can work without any server behavior - it simply requires some server URL to response with an HTML fragment. Note that the result should be an HTML FRAGMENT not a complete HTML page since the content is assigned to the innerHTML property of the panel.

To hook up a hover behavior:

<a href="somelink.htm" onmouseover="HoverTest(event)" onmouseout="HoverTestHide()">
Click me</a>

To make the calls:

// *** Best to use a global var for the Hover Panel
// *** Pass in the name of the HoverPanel Server Control and a URL
var Hover = new HoverPanel("Panel","InvoiceAbstract.aspx");
function HoverTest(event) 
    Hover.navigateDelay = 400;
    Hover.adjustWindowPosition = true;
    Hover.eventHandlerMode = "ShowHtmlAtMousePosition"
    Hover.shadowOpacity = .10;
    Hover.shadowOffset = 10;
    Hover.hoverOffsetRight = 30;

    // *** Start the actual callback: Event object, QueryString, PostData, ErrorHandler
function HoverTestHide(event)


This class has no dependencies on server side features.

Class Members



Assigns HTML content to the panel or more specifically the element specified in htmlTargetClientId.



Hides the panel, making it invisible by setting display="none";



Used to move the panel to a given position handling all the display aspects including opacity and shadow display. Pass in either x,y coordinates, and event object or nothing if an event object was provided with the call the startCallback.


Makes the panel visible at its last known position.


Shows the IFrame in the various IFrame modes. You can use the regular hide methods to clear the window.



Main method that fires the actual request to the server. The serverUrl must be set at minimum before this method should be called.



Adjust the position of the window so that the window bumps up if it runs off the bottom or left if runs off the right to keep the content visible.


The error handler that is called when an error occurs retrieving the content.


Optional client script handler called when the request completes. This event is fired just before the content is assigned to the panel and the HTML value of the response is provided as a parameter.


Determines how the request is handled when the callback returns.


The name of the form that is serialized and sent to the server when the postbackMode is POST. If not specified all form variables items are sent.


Bottom offset for auto placed content.


The right offset for hover windows that are auto positioned. Adds this offset the auto position.


Determines the time in milliseconds before a call to startCallback actually triggers the callback on the server.


Determines the opacity of the shadow.


The HTML client id of the control that is updated with the callback's result content. By default this value is the same as the control's controlId property so by default the full content of the panel is updated. By specifying a ControlId only that specific element is updated which allows for composition of reusable content inside of the panel.


Determines the opacity of the panel. Default: 1


Determines how data is posted back to the server.


The Url used to access the server. This Url is set through the constructor typically but you can override it explicitly with this property.


Determines the offset of the shadow if any. 0 means no shadow is displayed.

© West Wind Technologies, 1996-2024 • Updated: 04/27/2014
Comment or report problem with topic