Member Avatar for bharanidharanit

Hello,
How to create hover menu. I want to create exactly as attached in the picture. When i mouse over the attendance, the menu should be displayed as such in the picture.
Anyone help in this?
Thankyou.

hover_menu.JPG 11.18 KB
Edited by bharanidharanit because: n/a
  • 2 Contributors
  • 2 Replies
  • 293 Views
  • 1 Week Discussion Span
  • Latest Post Latest Post by bharanidharanit

Recommended Answers

All 2 Replies

Member Avatar for reach_yousuf

Hi
It's as simple as that. take a look at the eg:

<asp:Menu ID="Menu1" runat="server" BackColor="#E3EAEB" DynamicHorizontalOffset="2" Font-Names="Verdana" Font-Size="0.8em" ForeColor="#666666" StaticSubMenuIndent="10px">
                        <StaticSelectedStyle BackColor="#1C5E55" />
                        <StaticMenuItemStyle HorizontalPadding="5px" VerticalPadding="2px" />
                        <DynamicHoverStyle BackColor="#666666" ForeColor="White" />
                        <DynamicMenuStyle BackColor="#E3EAEB" />
                        <DynamicItemTemplate>
                            <%# Eval("Text") %>
                        </DynamicItemTemplate>
                        <DynamicSelectedStyle BackColor="#1C5E55" />
                        <DynamicMenuItemStyle HorizontalPadding="5px" VerticalPadding="2px" />
                        <StaticHoverStyle BackColor="#666666" ForeColor="White" />
                        <Items>
                            <asp:MenuItem Selectable="False" Text="Select" Value="Select"></asp:MenuItem>
                            <asp:MenuItem Text="Product" Value="Items">
                                <asp:MenuItem NavigateUrl="~/Product/Product.aspx" Text="Item Card" Value="Item Card">
                                </asp:MenuItem>
                                <asp:MenuItem NavigateUrl="~/GridViewTest.aspx" Text="GridViewTest" Value="GridViewTest">
                                </asp:MenuItem>
                                
                                <asp:MenuItem NavigateUrl="~/Product/frmRptProduct.aspx" >
                                </asp:MenuItem>
                                
                            </asp:MenuItem>
                            <asp:MenuItem Text="Sales" Value="Sales"></asp:MenuItem>
                            <asp:MenuItem Text="Purchase" Value="Purchase"></asp:MenuItem>
                            <asp:MenuItem Text="Test" Value="Purchase" NavigateUrl="~/ConfimButtonExtenderEg.aspx"></asp:MenuItem>
                            <asp:MenuItem Text="Reports" Value="Reports" NavigateUrl="~/Product/frmRptContainer.aspx" ></asp:MenuItem>
                            <asp:MenuItem Text="DAAB3.1Test" Value="DAAB3.1Test" NavigateUrl="~/Test_DAAB3.aspx" ></asp:MenuItem>
                            <asp:MenuItem Text="Create User" Value="DAAB3.1Test" NavigateUrl="~/createUser.aspx" ></asp:MenuItem>
                            
                        </Items>
                    </asp:Menu>

Mark as solved if it helps you!!!

Edited by reach_yousuf because: n/a
Member Avatar for bharanidharanit

Hi
It's as simple as that. take a look at the eg:

<asp:Menu ID="Menu1" runat="server" BackColor="#E3EAEB" DynamicHorizontalOffset="2" Font-Names="Verdana" Font-Size="0.8em" ForeColor="#666666" StaticSubMenuIndent="10px">
                        <StaticSelectedStyle BackColor="#1C5E55" />
                        <StaticMenuItemStyle HorizontalPadding="5px" VerticalPadding="2px" />
                        <DynamicHoverStyle BackColor="#666666" ForeColor="White" />
                        <DynamicMenuStyle BackColor="#E3EAEB" />
                        <DynamicItemTemplate>
                            <%# Eval("Text") %>
                        </DynamicItemTemplate>
                        <DynamicSelectedStyle BackColor="#1C5E55" />
                        <DynamicMenuItemStyle HorizontalPadding="5px" VerticalPadding="2px" />
                        <StaticHoverStyle BackColor="#666666" ForeColor="White" />
                        <Items>
                            <asp:MenuItem Selectable="False" Text="Select" Value="Select"></asp:MenuItem>
                            <asp:MenuItem Text="Product" Value="Items">
                                <asp:MenuItem NavigateUrl="~/Product/Product.aspx" Text="Item Card" Value="Item Card">
                                </asp:MenuItem>
                                <asp:MenuItem NavigateUrl="~/GridViewTest.aspx" Text="GridViewTest" Value="GridViewTest">
                                </asp:MenuItem>
                                
                                <asp:MenuItem NavigateUrl="~/Product/frmRptProduct.aspx" >
                                </asp:MenuItem>
                                
                            </asp:MenuItem>
                            <asp:MenuItem Text="Sales" Value="Sales"></asp:MenuItem>
                            <asp:MenuItem Text="Purchase" Value="Purchase"></asp:MenuItem>
                            <asp:MenuItem Text="Test" Value="Purchase" NavigateUrl="~/ConfimButtonExtenderEg.aspx"></asp:MenuItem>
                            <asp:MenuItem Text="Reports" Value="Reports" NavigateUrl="~/Product/frmRptContainer.aspx" ></asp:MenuItem>
                            <asp:MenuItem Text="DAAB3.1Test" Value="DAAB3.1Test" NavigateUrl="~/Test_DAAB3.aspx" ></asp:MenuItem>
                            <asp:MenuItem Text="Create User" Value="DAAB3.1Test" NavigateUrl="~/createUser.aspx" ></asp:MenuItem>
                            
                        </Items>
                    </asp:Menu>

Mark as solved if it helps you!!!

Thankyou, the code is working.

Be a part of the DaniWeb community

We're a friendly, industry-focused community of developers, IT pros, digital marketers, and technology enthusiasts meeting, networking, learning, and sharing knowledge.