如何在引导菜单栏中添加巨型菜单 [英] How to add the mega menu in bootstrap menu bar
本文介绍了如何在引导菜单栏中添加巨型菜单的处理方法,对大家解决问题具有一定的参考价值,需要的朋友们下面随着小编来一起学习吧!
问题描述
我在菜单栏中使用了bootstrap。现在我想我的菜单栏是巨型菜单,但没有得到如何使用bootstrap显示大型菜单。我想下拉菜单是大型菜单< ul class =dropdown-menu>
..
这是HTML ..
I have using bootstrap in my Menu bar.Now i want my menu bar to be mega menu but not getting how to show the mega menu using bootstrap.I want dropdown to be mega menu <ul class="dropdown-menu">
..
Here is the HTML..
<div class="collapse navbar-collapse navbar-right">
<ul class="nav navbar-nav">
<li class="active"><a href="index.html">Home</a></li>
<li><a href="about-us.html">About Us</a></li>
<li><a href="services.html">Services</a></li>
<li><a href="portfolio.html">Portfolio</a></li>
<li class="dropdown">
<a href="#" class="dropdown-toggle" data-toggle="dropdown">Pages <i class="fa fa-angle-down"></i></a>
<ul class="dropdown-menu">
<li><a href="blog-item.html">Blog Single</a></li>
<li><a href="pricing.html">Pricing</a></li>
<li><a href="404.html">404</a></li>
<li><a href="shortcodes.html">Shortcodes</a></li>
</ul>
</li>
<li><a href="blog.html">Blog</a></li>
<li><a href="contact-us.html">Contact</a></li>
</ul>
</div>
推荐答案
使用 Yamm3 megamenu
Extend your bootstrap with Yamm3 megamenu
这是指向小部件的链接
http://geedmo.github.io/yamm3/
像这样使用
<nav class="navbar yamm navbar-default " role="navigation">
...
<ul class="nav navbar-nav">
<li class="dropdown">
<a href="#" class="dropdown-toggle" data-toggle="dropdown">Dropdown</a>
<ul class="dropdown-menu">
<li>
<div class="yamm-content">
<div class="row">
...
</li>
</ul>
</li>
</ul>
...
</nav>
这里是工作fiddle
Here is working fiddle
http://jsfiddle.net/DTcHh/1698/
这篇关于如何在引导菜单栏中添加巨型菜单的文章就介绍到这了,希望我们推荐的答案对大家有所帮助,也希望大家多多支持IT屋!
查看全文