Zurb Foundation顶部栏下拉菜单栏不工作(手机大小的那个)
Zurb Foundation顶部栏下拉菜单栏不工作(手机大小的那个)
提问于 2013-12-21 21:03:56
大多数人谈论的是下拉菜单，当工具栏展开时，我说的是当你将浏览器窗口调整为手机大小时的菜单。你应该能够超过菜单和项目列表应该下拉http://foundation.zurb.com/docs/components/topbar.html的代码是从这个页面，(第二个例子)。如果您正在调整，它应该显示菜单和下拉式项目。
<!doctype html>
<html>
<head>
<link rel="stylesheet" href="css/normalize.css">
<link rel="stylesheet" href="css/foundation.css">
<link rel="stylesheet" href="css/app.css">
<script src="js/vendor/custom.modernizr.js"></script>
<script src="js/jquery.js"></script>
<script src="js/foundation.js"></script>
<script src="js/foundation.dropdown.js"></script>
<meta charset="utf-8">
<title>Gideon Sassoon</title>
</head>
<body>
<nav class="top-bar" data-topbar>
<ul class="title-area">
<li class="name">
<h1><a href="#">My Site</a></h1>
</li>
<li class="toggle-topbar menu-icon"><a href=""><span>Menu</span>
</a>
</li>
</ul>
<section class="top-bar-section">
<!-- Right Nav Section -->
<ul class="right">
<li class="active"><a href="#">Right Nav Button Active</a></li>
<li class="has-dropdown not-click">
<a href="#">Right Button with Dropdown</a>
<ul class="dropdown">
<li><a href="#">First link in dropdown</a></li>
</ul>
</li>
</ul>
</section>
</nav>
<script>$(document).foundation();</script>
</body>
</html>好的，代码是正确的，我检查过了，我的一个朋友也检查过了。为了澄清，我不是指下拉菜单的右按钮。这非常好用。
回答 3
Stack Overflow用户
发布于 2013-12-21 21:17:39
如果我理解正确的话，当鼠标悬停在这里时，您期望“移动模式”中的顶部栏菜单按钮会下拉。
用鼠标。
在这种情况下，顶部栏按设计工作-在移动触摸设备上没有悬停，所以它只在移动模式下对触摸/点击做出反应。
编辑：
我现在明白你的问题是点击“菜单”开关重新加载页面。您似乎忘记了包含Foundation topbar脚本：
<script src="js/foundation.js"></script>
<script src="js/foundation.dropdown.js"></script>
<script src="js/foundation.topbar.js"></script>Stack Overflow用户
发布于 2014-02-19 14:49:16
我知道这是旧的，但是我想我已经解决了你所看到的相同的问题，所以我添加了这个答案给任何遇到它的人。
对我来说，问题是我试图覆盖CSS中顶部栏元素的高度。一旦我删除了这个条目，我的顶部栏在小屏幕上就可以正常工作了
.top-bar {
height: 3em;
}希望这对某些人有帮助
Stack Overflow用户
发布于 2014-05-27 16:55:27
我也遇到了同样的问题，解决方法是：
$('.left-off-canvas-toggle').on('click', function(){});页面原文内容由Stack Overflow提供。腾讯云小微IT领域专用引擎提供翻译支持
原文链接：
https://stackoverflow.com/questions/20719303
复制相关文章
相似问题
腾讯云开发者
