【发布时间】:2017-01-18 20:08:11
【问题描述】:
我在 Rails 项目中使用 Materialize,但我不确定为什么可折叠导航栏转换没有响应。
_nav.html.erb
<nav>
<div class="nav-wrapper">
<a href="/" class="brand-logo center">LOGO</a>
<a href="#" data-activates="mobile-demo" class="button-collapse"><i class="material-icons">menu</i></a>
<ul id="nav-mobile" class="left hide-on-med-and-down">
<li><%= link_to "Signup", new_user_registration_path %></li>
<li><%= link_to "Logout", destroy_session_path(current_user) if current_user %></li>
</ul>
<ul class="side-nav" id="mobile-demo">
<li><%= link_to "Signup", new_user_registration_path %></li>
<li><%= link_to "Logout", destroy_session_path(current_user) if current_user %></li>
</ul>
</div>
community.js
$(document).ready(function(){
$(".button-collapse").sideNav();
)};
现在,如果我缩小视口并单击移动菜单按钮,屏幕会出现灰色覆盖,但实际的侧边栏本身不会出现。我检查了元素并将我的版本与 Materialize 网站上的演示版本进行了比较,无论出于何种原因,我的某些 CSS 组件似乎都呈现不正确。
首先在标签中,宽度没有在我这边调整。 Screenshot
其次,我这边的样式显示为左侧,而原始 Materialize 版本显示为变换。 Screenshot2
除了更改字体系列之外,我没有修改任何 CSS。几天前它可以工作,但现在不行了。有什么帮助吗?
【问题讨论】:
标签: jquery html css ruby-on-rails materialize