Arc*_*Arc 2 css ruby-on-rails drop-down-menu
我想像在Rails gudes网站(http://guides.rubyonrails.org/)中使用的那个或者在BaseCamp.CAn中使用的那些,使用Rails表单助手完成一个巨型工作?
不是自动的,没有."mega下拉列表"实际上只是一个DIV元素,看起来好像是"指南索引"打开了.您所要做的就是定位DIV,使其看起来正确.
在您提供的网站中,这是通过将DIV嵌套在包含"Guide Index"元素的元素内部来完成的.像这样的东西:
<outerelement style="position: relative; top: 0px; left: 0px">
<a href="#">Guide Index</a>
<div id="index" style="position: absolute; top: 0px; left: 0px; display: none">
<!-- all the items in the guide index -->
</div>
</outerelement>
Run Code Online (Sandbox Code Playgroud)
我不记得如何在Rails中使用原型助手来生成这个,但是当你点击"引导索引"链接时你只需要一些Javascript代码就可以了:
Element.toggle('index');
Run Code Online (Sandbox Code Playgroud)
可能是这样的:
<%=link_to_function("Guide Index", "Element.toggle('index')")%>
Run Code Online (Sandbox Code Playgroud)
那么你在.rb文件中最终得到的是:
<outerelement style="position: relative; top: 0px; left: 0px">
<%=link_to_function("Guide Index", "Element.toggle('index')")%>
<div id="index" style="position: absolute; top: 0px; left: 0px; display: none">
<!-- all the items in the guide index -->
</div>
</outerelement>
Run Code Online (Sandbox Code Playgroud)
| 归档时间: |
|
| 查看次数: |
1145 次 |
| 最近记录: |