HoverMenu控件的使用

功能:
    当鼠标移动到指定的位置时,在不影响其他的元素的情况下出现一个菜单,并允许用户进行一些操作。
属性:
    TargetControlID:要显示菜单的目标控件的ID
    PopupControlID:作为弹出菜单的控件的ID
    HoverCssClass:鼠标移动到目标控件时目标控件的样式
    PopupPosition:弹出菜单所在的位置,共有五个值(bottom,top,left,right,center)
    OffsetX:菜单距离目标控件的位置--横坐标
    OffsetY:菜单距离目标控件的位置--纵坐标
    PopDelay:弹出菜单的延迟时间
代码实例:
 
HoverMenu控件的使用<body onload="focus();">
HoverMenu控件的使用  
<center>    
HoverMenu控件的使用      请移动鼠标到某一行数据上,以便看到
<strong>“停靠菜单(HoverMenu)”</strong>
HoverMenu控件的使用    
HoverMenu控件的使用    
<form id="form1" runat="server">
HoverMenu控件的使用      
<asp:ScriptManager ID="ScriptManager1" runat="server">
HoverMenu控件的使用      
</asp:ScriptManager>
HoverMenu控件的使用
HoverMenu控件的使用      
<asp:UpdatePanel ID="UpdatePanel1" runat="server">
HoverMenu控件的使用        
<ContentTemplate>
HoverMenu控件的使用          
<asp:GridView ID="GridView1" runat="server"
HoverMenu控件的使用                        AllowPaging
="True"
HoverMenu控件的使用                        AutoGenerateColumns
="False"
HoverMenu控件的使用                        DataKeyNames
="员工号码"
HoverMenu控件的使用                        DataSourceID
="SqlDataSource1" PageSize="5">
HoverMenu控件的使用            
<Columns>
HoverMenu控件的使用              
<asp:TemplateField>
HoverMenu控件的使用                
<EditItemTemplate>
HoverMenu控件的使用HoverMenu控件的使用                  
<%HoverMenu控件的使用-- 存放编辑项目样板的容器 --%>
HoverMenu控件的使用                  
<asp:Panel ID="panEdit" runat="server">
HoverMenu控件的使用                    
<table>
HoverMenu控件的使用                      
<tr>
HoverMenu控件的使用                        
<td width="100">
HoverMenu控件的使用                          
<asp:Label ID="Label1" runat="server" Text='<%# Eval("员工号码") %>'></asp:Label>
HoverMenu控件的使用                        
</td>
HoverMenu控件的使用                        
<td width="100">
HoverMenu控件的使用                          
<asp:TextBox ID="TextBox1" runat="server" Text='<%# Bind("姓名") %>' width="90"></asp:TextBox>
HoverMenu控件的使用                        
</td>
HoverMenu控件的使用                        
<td width="50">
HoverMenu控件的使用                          
<asp:TextBox ID="TextBox2" runat="server" Text='<%# Bind("性别") %>' width="40"></asp:TextBox>
HoverMenu控件的使用                        
</td>
HoverMenu控件的使用                        
<td width="100">
HoverMenu控件的使用                          
<asp:TextBox ID="TextBox3" runat="server" Text='<%# Bind("邮政编码") %>' width="90"></asp:TextBox>
HoverMenu控件的使用                        
</td>
HoverMenu控件的使用                        
<td width="450">
HoverMenu控件的使用                          
<asp:TextBox ID="TextBox4" runat="server" Text='<%# Bind("地址") %>' width="440"></asp:TextBox>
HoverMenu控件的使用                        
</td>
HoverMenu控件的使用                      
</tr>
HoverMenu控件的使用                    
</table>
HoverMenu控件的使用                  
</asp:Panel>
HoverMenu控件的使用                  
HoverMenu控件的使用HoverMenu控件的使用                  
<%HoverMenu控件的使用-- 存放停驻选单(HoverMenu)的容器 --%>
HoverMenu控件的使用                  
<asp:Panel ID="panHoverMenu" runat="server" width="50px" CssClass="cssHoverMenu">
HoverMenu控件的使用                    
<div style="padding: 2px; border: purple 2px dashed; text-align: center;">
HoverMenu控件的使用                      
<asp:LinkButton ID="lnkbtnUpdate" runat="server"
HoverMenu控件的使用                                      CommandName
="Update">更新</asp:LinkButton><br />
HoverMenu控件的使用                      
<asp:LinkButton ID="lnkbtnCancel" runat="server"
HoverMenu控件的使用                                      CommandName
="Cancel">取消</asp:LinkButton>
HoverMenu控件的使用                    
</div>
HoverMenu控件的使用                  
</asp:Panel>
HoverMenu控件的使用
HoverMenu控件的使用HoverMenu控件的使用                  
<%HoverMenu控件的使用-- 指定停驻选单(HoverMenu)的属性 --%>
HoverMenu控件的使用                  
<ajaxToolkit:HoverMenuExtender ID="hmeEdit" runat="server"
HoverMenu控件的使用                                                 TargetControlID
="panEdit"
HoverMenu控件的使用                                                 PopupControlID
="panHoverMenu"
HoverMenu控件的使用                                                 PopupPosition
="Right"
HoverMenu控件的使用                                                 PopDelay
="50"
HoverMenu控件的使用                                                 OffsetX
="-10"
HoverMenu控件的使用                                                 OffsetY
="5"
HoverMenu控件的使用                                                 HoverCssClass
="cssRowHover">
HoverMenu控件的使用                  
</ajaxToolkit:HoverMenuExtender>
HoverMenu控件的使用
HoverMenu控件的使用HoverMenu控件的使用                  
<%HoverMenu控件的使用-- 确认按钮(ConfirmButton) --%>
HoverMenu控件的使用                  
<ajaxToolkit:ConfirmButtonExtender ID="cbeUpdate" runat="server"
HoverMenu控件的使用                                                     TargetControlID
="lnkbtnUpdate"
HoverMenu控件的使用                                                     ConfirmText
="确定要更新吗?">
HoverMenu控件的使用                  
</ajaxToolkit:ConfirmButtonExtender>
HoverMenu控件的使用                
</EditItemTemplate>
HoverMenu控件的使用                
<ItemTemplate>
HoverMenu控件的使用HoverMenu控件的使用                  
<%HoverMenu控件的使用-- 存放项目样板的容器 --%>
HoverMenu控件的使用                  
<asp:Panel ID="panItem" runat="server">
HoverMenu控件的使用                    
<table>
HoverMenu控件的使用                      
<tr>
HoverMenu控件的使用                        
<td width="100">
HoverMenu控件的使用                          
<asp:Label ID="Label1" runat="server" Text='<%# Eval("员工号码") %>'></asp:Label>
HoverMenu控件的使用                        
</td>
HoverMenu控件的使用                        
<td width="100">
HoverMenu控件的使用                          
<asp:Label ID="Label2" runat="server" Text='<%# Bind("姓名") %>'></asp:Label>
HoverMenu控件的使用                        
</td>
HoverMenu控件的使用                        
<td width="50">
HoverMenu控件的使用                          
<asp:Label ID="Label3" runat="server" Text='<%# Bind("性别") %>'></asp:Label>
HoverMenu控件的使用                        
</td>
HoverMenu控件的使用                        
<td width="100">
HoverMenu控件的使用                          
<asp:Label ID="Label4" runat="server" Text='<%# Bind("邮政编码") %>'></asp:Label>
HoverMenu控件的使用                        
</td>
HoverMenu控件的使用                        
<td align="left" width="450">
HoverMenu控件的使用                          
<asp:Label ID="Label5" runat="server" Text='<%# Bind("地址") %>'></asp:Label>
HoverMenu控件的使用                        
</td>
HoverMenu控件的使用                      
</tr>
HoverMenu控件的使用                    
</table>
HoverMenu控件的使用                  
</asp:Panel>
HoverMenu控件的使用
HoverMenu控件的使用HoverMenu控件的使用                  
<%HoverMenu控件的使用-- 存放停驻选单(HoverMenu)的容器 --%>
HoverMenu控件的使用                  
<asp:Panel ID="panHoverMenu" runat="server" width="50px" CssClass="cssHoverMenu">
HoverMenu控件的使用                    
<div style="padding: 2px; border: purple 2px dashed; text-align: center;">
HoverMenu控件的使用                      
<asp:LinkButton ID="lnkBtnEdit" runat="server"
HoverMenu控件的使用                                      CommandName
="Edit">编辑</asp:LinkButton><br />
HoverMenu控件的使用                      
<asp:LinkButton ID="lnkBtnDel" runat="server"
HoverMenu控件的使用                                      CommandName
="Delete">删除</asp:LinkButton>
HoverMenu控件的使用                    
</div>
HoverMenu控件的使用
HoverMenu控件的使用HoverMenu控件的使用                    
<%HoverMenu控件的使用-- 指定停驻选单(HoverMenu)的属性 --%>
HoverMenu控件的使用                    
<ajaxToolkit:HoverMenuExtender ID="hmeItem" runat="server"
HoverMenu控件的使用                                                   TargetControlID
="panItem"
HoverMenu控件的使用                                                   PopupControlID
="panHoverMenu"
HoverMenu控件的使用                                                   PopupPosition
="Left"
HoverMenu控件的使用                                                   PopDelay
="50"
HoverMenu控件的使用                                                   OffsetX
="10"
HoverMenu控件的使用                                                   OffsetY
="-5"
HoverMenu控件的使用                                                   HoverCssClass
="cssRowHover">
HoverMenu控件的使用                    
</ajaxToolkit:HoverMenuExtender>
HoverMenu控件的使用
HoverMenu控件的使用HoverMenu控件的使用                    
<%HoverMenu控件的使用-- 确认按钮(ConfirmButton) --%>
HoverMenu控件的使用                    
<ajaxToolkit:ConfirmButtonExtender ID="cbeDelete" runat="server"
HoverMenu控件的使用                                                       TargetControlID
="lnkBtnDel"
HoverMenu控件的使用                                                       ConfirmText
="确定要删除吗?">
HoverMenu控件的使用                    
</ajaxToolkit:ConfirmButtonExtender>
HoverMenu控件的使用                  
</asp:Panel>
HoverMenu控件的使用                
</ItemTemplate>
HoverMenu控件的使用                
<HeaderTemplate>
HoverMenu控件的使用                  
<table>
HoverMenu控件的使用                    
<tr>
HoverMenu控件的使用                      
<td colspan="5" align="center" bgcolor="#ccffff">
HoverMenu控件的使用                        
<font color="black" size="+2"><strong>员工信息列表</strong></font>
HoverMenu控件的使用                      
</td>
HoverMenu控件的使用                    
</tr>
HoverMenu控件的使用                    
<tr bgcolor="#cc00ff">
HoverMenu控件的使用                      
<td align="center" width="100px">
HoverMenu控件的使用                        
<font color="white"><strong>员工号码</strong></font></td>
HoverMenu控件的使用                      
<td align="center" width="100px">
HoverMenu控件的使用                        
<font color="white"><strong>姓名</strong></font>
HoverMenu控件的使用                      
</td>
HoverMenu控件的使用                      
<td align="center" width="50px">
HoverMenu控件的使用                        
<font color="white"><strong>性别</strong></font>
HoverMenu控件的使用                      
</td>
HoverMenu控件的使用                      
<td align="center" width="100px">
HoverMenu控件的使用                        
<font color="white"><strong>邮政编码</strong></font>
HoverMenu控件的使用                      
</td>
HoverMenu控件的使用                      
<td align="center" width="450px">
HoverMenu控件的使用                        
<font color="white"><strong>地址</strong></font>
HoverMenu控件的使用                      
</td>
HoverMenu控件的使用                    
</tr>
HoverMenu控件的使用                  
</table>
HoverMenu控件的使用                
</HeaderTemplate>                
HoverMenu控件的使用              
</asp:TemplateField>
HoverMenu控件的使用            
</Columns>
HoverMenu控件的使用            
<AlternatingRowStyle BackColor="#FFF0C0" />
HoverMenu控件的使用          
</asp:GridView>
HoverMenu控件的使用        
</ContentTemplate>
HoverMenu控件的使用      
</asp:UpdatePanel>
HoverMenu控件的使用
HoverMenu控件的使用         
HoverMenu控件的使用      
<asp:SqlDataSource ID="SqlDataSource1" runat="server"
HoverMenu控件的使用        ConflictDetection
="CompareAllValues"
HoverMenu控件的使用        ConnectionString
="<%$ ConnectionStrings:Northwind %>"
HoverMenu控件的使用        DeleteCommand
="DELETE FROM Employee WHERE EmployID = @original_EmployID AND UserName = @original_UserName AND Sex = @original_Sex AND MailCode = @original_MailCode AND Address = @original_Address"
HoverMenu控件的使用        InsertCommand
="INSERT INTO Employee (UserName, Sex, MailCode, Address) VALUES (@UserName, @Sex, @MailCode, @Address)"
HoverMenu控件的使用        OldValuesParameterFormatString
="original_{0}"
HoverMenu控件的使用        SelectCommand
="SELECT EmployID, UserName, Sex, MailCode, Address FROM Employee"
HoverMenu控件的使用        UpdateCommand
="UPDATE Employee SET UserName = @UserName, Sex = @Sex, MailCode = @MailCode, Address = @Address WHERE EmployID = @original_EmployID AND UserName = @original_UserName AND Sex= @original_Sex AND MailCode = @original_MailCode AND Address = @original_Address">
HoverMenu控件的使用        
<DeleteParameters>
HoverMenu控件的使用          
<asp:Parameter Name="original_EmployID" Type="Int32" />
HoverMenu控件的使用          
<asp:Parameter Name="original_UserName" Type="String" />
HoverMenu控件的使用          
<asp:Parameter Name="original_Sex" Type="String" />
HoverMenu控件的使用          
<asp:Parameter Name="original_MailCode" Type="String" />
HoverMenu控件的使用          
<asp:Parameter Name="original_Address" Type="String" />
HoverMenu控件的使用        
</DeleteParameters>
HoverMenu控件的使用        
<UpdateParameters>
HoverMenu控件的使用          
<asp:Parameter Name="UserName" Type="String" />
HoverMenu控件的使用          
<asp:Parameter Name="Sex" Type="String" />
HoverMenu控件的使用          
<asp:Parameter Name=MailCode" Type="String" />
HoverMenu控件的使用          
<asp:Parameter Name="Address" Type="String" />
HoverMenu控件的使用          
<asp:Parameter Name="original_EmployID" Type="Int32" />
HoverMenu控件的使用          
<asp:Parameter Name="originalUserName" Type="String" />
HoverMenu控件的使用          
<asp:Parameter Name="original_Sex" Type="String" />
HoverMenu控件的使用          
<asp:Parameter Name="original_MailCode" Type="String" />
HoverMenu控件的使用          
<asp:Parameter Name="original_Address" Type="String" />
HoverMenu控件的使用        
</UpdateParameters>
HoverMenu控件的使用        
<InsertParameters>
HoverMenu控件的使用          
<asp:Parameter Name="UserName" Type="String" />
HoverMenu控件的使用          
<asp:Parameter Name="Sex" Type="String" />
HoverMenu控件的使用          
<asp:Parameter Name="MailCode" Type="String" />
HoverMenu控件的使用          
<asp:Parameter Name="Address" Type="String" />
HoverMenu控件的使用        
</InsertParameters>
HoverMenu控件的使用      
</asp:SqlDataSource>
HoverMenu控件的使用    
</form>
HoverMenu控件的使用  
</center>
HoverMenu控件的使用
</body>
   
运行结果:
    HoverMenu控件的使用
    当鼠标移到数据行上时显示如下:
 HoverMenu控件的使用
    移到第4条记录上,单击"编辑"后,
HoverMenu控件的使用
单击确定后,就把记录更新。否则,放弃修改。

转载于:https://www.cnblogs.com/abcdwxc/archive/2007/11/05/950081.html