问引导:将头(navbar)中类似facebook的通知实现为子菜单，而不仅仅是一个计数器。
EN

Stack Overflow用户

提问于 2013-11-04 07:00:41

回答 1查看 13.2K关注 0票数 3

很可能我只是弱智，几分钟内就能得到答案，但我似乎找不到我要找的东西。

我需要在我的导航栏中实现“facebook式”通知。对我来说，实现一个图标旁边的计数器，并将它链接到下拉列表是没有问题的。在该子菜单中以通知的形式动态加载新条目也没有问题。但我似乎找不到的是真正的子菜单。

我知道这是一个自定义CSS，它显示带有固定的最大高度和溢出的子菜单，这样您就可以滚动到它中，但是找不到任何教程/默认示例来显示CSS是如何完成的。它是用许多管理皮肤实现的，但是当我搜索通知时，Google并没有显示我的意思:它显示的是“其他”五音(在facebook中:左下标)，而不是导航条通知。

那些“导航条通知”叫什么？有没有人有一个教程，简单的CSS或其他任何东西？我已经找了几天了，这是我最后的选择(尽管我不应该那么固执，马上就问了:我想做我的家庭作业/努力)。我被困住了..。

总结：

我并不是在寻找这些：

我在找这个：

http://demo.themepixels.com/webpage/starlight/dashboard.html (右上角"5"，点击->那个菜单！)
admin&page=index.html (右上角的三个按钮，没有那些荒谬的烦人的盒子lol)
http://suggeelson.com/themes/supr/dashboard.html?username=Administrator&password=somepass (但那个似乎不支持二十多个通知)

(对于那些想通过简单的回答“嘿，你可以撕掉那个CSS”或者“为什么你不买那个主题？”答案很简单:我不撕扯，当我需要一个元素的时候，我不会为一个完整的主题付钱。我只是在寻找一个关于如何获得CSS设置的教程，或者是一些我可以实现的插件)

如前所述，后端/jquery“推送”不是问题。只是那个东西的名字和我怎么能把它的样式。

-编辑--

工具提示/弹出器正在做我想做的事情，但仍然不完全是我正在做的事情(当你在工具提示/弹出器上盘旋时，它们就消失了，这样就能正常工作.)定制一个下拉列表，只剩下一些额外的css来让事情正常工作。糟糕的是，没有一个正常的/完整的教程。不管怎么说，谢谢这20位浏览:)

jquery

css

twitter-bootstrap

云直播特惠9.9元起

基于腾讯云多年音视频能力积淀，支持超低延迟、超高画质、超大并发访问量的直播需求，满足客户的多样化直播需求

回答 1

Stack Overflow用户

发布于 2019-04-12 11:19:06

我使用的是引导3.3.7和ASP.NET Core，其ViewComponent基本如下所示：

<a href="#" data-toggle="dropdown" role="button">Notifications</a>
<ul class="dropdown-menu dropdown-menu-right notify-drop">
    <div>
        <div>@Title</div>
    </div>
    <div>
        <li>@Content</li>
    </div>
    <div>
        <a>Mark All Read</a>
    </div>
</ul>