Introduction:-
The Hover Menu Extender is an Ajax control which popups when the mouse moves over the control. This popup is one type of container control with visibility as hidden and contains some another controls to display in popups. So I have created one simple Hover Menu on LinkButton on mouse over it shows one list of hyperlink in popup.-TargetControlID - The control that the extender is targeting. When the mouse cursor is over this control, the hover menu popup will be displayed.
-PopupControlID - The ID of the control to display when mouse is over the target control. In this case, it's just a simple panel with list of linkbutton
-HoverCssClass - The CSS class to apply to the target when the hover menu popup is visible.
-PopupPostion - Where the popup should be positioned relative to the target control. Can be Left (Default), Right, Top, Bottom, Center.
-OffsetX/OffsetY - The number of pixels to offset the Popup from it's default position, as specified by
Popup Position. So if you want it to popup to the left of the target and have a 5px space between the popup and the target, the value should be "-5".
-HoverDelay - The time, in milliseconds, before the popup displays after hovering over the target control. Default is 0.
-PopDelay - The time, in milliseconds, for the popup to remain visible after the mouse moves away from the target control. Default is 100.
Source Code: (in asp.net):-
<%@ page language="C#" autoeventwireup="true" codefile="hvmenu.aspx.cs" inherits="hvmenu" %>
<%@ register assembly="AjaxControlToolkit" namespace="AjaxControlToolkit" tagprefix="asp" %>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head runat="server">
<title></title>
</head>
<body>
<form id="form1" runat="server">
<div>
<asp:toolkitscriptmanager id="ToolkitScriptManager1" runat="server">
</asp:toolkitscriptmanager>
<asp:label id="Label1" runat="server" text="Plz take mouse over me"></asp:label>
<asp:panel id="pan" runat="server">
<asp:LinkButton ID="LinkButton1" runat="server">Link 1</asp:LinkButton><br />
<asp:LinkButton ID="LinkButton2" runat="server">Link 2</asp:LinkButton><br />
<asp:LinkButton ID="LinkButton3" runat="server">Link 3</asp:LinkButton><br />
<asp:LinkButton ID="LinkButton4" runat="server">Link 4</asp:LinkButton><br />
<asp:LinkButton ID="LinkButton5" runat="server">Link 5</asp:LinkButton>
</asp:panel>
<asp:hovermenuextender id="Label1_HoverMenuExtender" runat="server" dynamicservicepath=""
enabled="True" offsetx="10" offsety="20" targetcontrolid="Label1" popupcontrolid="pan">
</asp:hovermenuextender>
</div>
</form>
</body>
</html>
2 comments
how many pannel v can add in hover control
ReplyAt a time only one panel you can set to popupcontrolid="" attribute.
ReplyPost a Comment