jQuery的菜单ASP.NET 网站地图

StackOverflow https://stackoverflow.com/questions/103630

  •  01-07-2019
  •  | 
  •  

题

它是能够使用 ASP.NET 网。网站有一个jQuery 快鱼 菜单吗？

如果没有，是否有任何基于标准的浏览器的不可知的可用的插件的工作网。网站的文件？

有帮助吗？

解决方案

我发现这个问题而寻找相同的答案...每个人都 说的 这是可能的，但没有一个给出了实际解决办法！我似乎有它现在的工作所以我想发表我的调查结果...

东西我需要：

我完成了 Masterpage.master 具有以下 head 标签：

<head runat="server">
    <script type="text/javascript" src="/script/jquery-1.3.2.min.js"></script>
    <script type="text/javascript" src="/script/superfish.js"></script>
    <link href="~/css/superfish.css" type="text/css" rel="stylesheet" media="screen" runat="server" />
    <script type="text/javascript">

        $(document).ready(function() {
        $('ul.AspNet-Menu').superfish();
        }); 

</script>
</head>

这基本上是所有的东西需要延长超能的菜单的工作。内部网页(菜单言)看起来像这样(根据 这些指令):

<asp:SiteMapDataSource ID="SiteMapDataSource" runat="server"
    ShowStartingNode="false" />
<asp:Menu ID="Menu1" runat="server" 
    DataSourceID="SiteMapDataSource"
    Orientation="Horizontal" CssClass="sf-menu">
</asp:Menu>

根据该文件，这似乎是应该的工作-但是它没有。其原因是， CssClass="sf-menu" 被复盖的菜单时呈现的和 <ul> 标记得一个 class="AspNet-Menu".我认为线 $('ul.AspNet-Menu').superfish(); 会有所帮助，但它没有。

有一件事

虽然这是一个黑客(和请某人点我要正确的解决办法)我是能够得到它的工作通过打开的 superfish.css 文件和 搜索和替换 sf-菜单 与 AspNet-菜单...瞧！菜单上出现。我以为会有一些结构设置在 asp:Menu 控制那里我可以的 <ul> 类，但没有发现任何提示经由。

其他提示

是的，完全有可能。

我已将它与ASP：Menu控件和带有Superfish插件的jQuery 1.2.6一起使用。请注意，您需要 ASP.NET 2.0 CSS友好控制适配器。

ASP.NET将ASP：Menu控件生成为表格布局。 CSS友好控制适配器将使ASP.NET生成ASP：Menu控件作为div内的UL / LI布局。

这样可以轻松集成jQuery和Superfish插件，因为Superfish插件依赖于UL / LI布局。

看起来您需要为Superfish生成UL。您应该可以从站点地图使用ASP.Net执行此操作。我认为站点地图控件会做这样的事情。如果没有，直接从C＃调用站点地图并以编程方式生成DOM应该是非常简单的。您可以构建用户控件来执行此操作，也可以在母版页中执行此操作。

查看此MSDN文章，了解如何以编程方式枚举站点地图中的节点。

请记住为NonLink元素添加css类。 Superfish css元素不适合他们。如果你像我一样拥有不是链接的根菜单，那么它就会变得非常可怕。只需将AspNet-Menu-NonLink元素添加到superfish.css文件中即可正常渲染。

SiteMapDataSource控件应该能够绑定到任何分层数据绑定控件。我不熟悉superfish，但我知道有很多jQueryish控件可以做到这一点。

我创建了一个简洁的小样本项目，您可以在 http://simplesitemenu.codeplex.com/ 上使用它。

它是一个复合控件，可以从您的站点地图生成嵌套的UL / LI列表。

享受！

许可以下： CC-BY-SA 和 归因
不隶属于 StackOverflow
scroll top