Metro UI CSS - 下拉菜单不起作用

我正在使用METRO UI CSS。我实施了下拉菜单。看上去不错。但下拉列表没有显示。Metro UI CSS - 下拉菜单不起作用

我使用从下面的链接例如：

我将最新的METRO UI CSS包中的以下文件添加到我的html代码中。

<link href="metroui/css/metro-bootstrap.css" rel="stylesheet"> 
<link href="metroui/css/metro-bootstrap-responsive.css" rel="stylesheet"> 
<link href="metroui/docs/css/iconFont.css" rel="stylesheet"> 
<link href="metroui/docs/js/prettify/prettify.css" rel="stylesheet"> 
<link href="metroui/docs/css/docs.css" rel="stylesheet"> 

<!-- Load JavaScript Libraries --> 
<script src="metroui/js/metro-dropdown.js"></script> 
<script type="dropdown.js"></script> 
<script src="metroui/docs/js/jquery/jquery.min.js"></script> 
<script src="metroui/docs/js/jquery/jquery.widget.min.js"></script> 
<script src="metroui/docs/js/jquery/jquery.mousewheel.js"></script> 
<script src="metroui/docs/js/prettify/prettify.js"></script> 
<script src="metroui/docs/js/holder.js"></script> 

<!-- Metro UI CSS JavaScript plugins --> 
<script src="metroui/docs/js/load-metro.js"></script>

任何帮助将不胜感激！

来源

2014-09-30 BBHeeMAA

浏览器控制台中的任何错误？确保所有文件正确加载。 – 2014-09-30 12:12:57

感谢那一点！这是问题！ :) – BBHeeMAA 2014-09-30 12:29:20

-1

Metro UI取决于jQuery，您应该先包含jQuery，然后再包含Metro UI。

<!-- Load JavaScript Libraries --> 
<script src="metroui/docs/js/jquery/jquery.min.js"></script> 
<script src="metroui/docs/js/jquery/jquery.widget.min.js"></script> 
<script src="metroui/docs/js/jquery/jquery.mousewheel.js"></script> 
<script src="metroui/js/metro-dropdown.js"></script> 
<script src="dropdown.js"></script> 
<script src="metroui/docs/js/prettify/prettify.js"></script> 
<script src="metroui/docs/js/holder.js"></script>

来源

2014-09-30 11:26:35 dashtinejad

:(仍然不工作!!） – BBHeeMAA 2014-09-30 11:57:05

-1

你是否在服务器上运行它。请把它放到像XAMPP或WAMP这样的服务器的htdocs文件夹中。

如果通过“双击”运行它的链接就会像

file:///C:/xampp/htdocs/Metro-UI-CSS-master/docs/navbar.html

如果您在服务器上运行它的链接就会像

http://localhost/Metro-UI-CSS-master/docs/navbar.html

Whick纠正方式是你吗？

来源

2014-10-30 06:30:46 TommyDo

试试下面的 - 它的正常工作对我来说：

<script src="Scripts/jquery-2.1.3.min.js"></script> 
<script src="Scripts/jquery-ui.min.js"></script> 
<link href="Scripts/metro-ui/css/metro-bootstrap.css" rel="stylesheet" /> 
<link href="Scripts/metro-ui/css/metro-bootstrap-responsive.css" rel="stylesheet" /> 
<link href="Scripts/metro-ui/css/iconFont.css" rel="stylesheet" /> 
<script src="Scripts/metro-ui/js/jquery.min.js"></script> 
<script src="Scripts/metro-ui/js/jquery.widget.min.js"></script> 
<script src="Scripts/metro-ui/js/jquery.mousewheel.js"></script> 
<script src="Scripts/metro-ui/js/metro.min.js"></script> </pre>

，并添加class="metro"您<body>像这样：<body class="metro">

希望这会有所帮助。

来源

2015-01-05 22:24:34 SADP

导航栏下拉菜单仅适用于根文件夹中的文件。只有docs文件夹中的css/js似乎正常工作。我已尝试所有其他组合，他们不工作你必须让所有文件在根文件夹或导航栏下拉不会工作。

非导航栏下拉菜单可以在任何地方工作。

只有文档的CSS/JS版本工作。其他版本不

UPDATE：

在您需要更改路径相对于绝对负荷metro.js。

$(function(){ 
    if ((document.location.host.indexOf('.dev') > -1) || (document.location.host.indexOf('modernui') > -1)) { 
     $("<script/>").attr('src', '/docs/js/metro/metro-loader.js').appendTo($('head')); 
    } else { 
     $("<script/>").attr('src', '/docs/js/metro.min.js').appendTo($('head')); 
    } 
})

来源

2015-03-30 10:16:02 djack109

从作者：

metro.min.js包括所有的JS地铁组件。检查你的主要容器地铁班。如果您的构建版本从ajax下载，请将全局变量METRO_AUTO_REINIT设置为true。在这里看到更多https://github.com/olton/Metro-UI-CSS/issues/574

我已添加到标题标记，它的工作。

<script src="metroui/docs/js/load-metro.js"></script> <script>var METRO_AUTO_REINIT = true;</script>

来源

2015-04-15 17:10:23

请提供一些解释，以不仅提供OP与工作代码，但也教他一些东西。 – Keelan 2015-04-15 18:04:57

Metro UI CSS - 下拉菜单不起作用

回答

相关问题