HTML: I am using the classes 'menu' and 'settings1' for my two dropdown menus.
HTML:我在两个下拉菜单中使用类'menu'和'settings1'。
Dropdown elements 1: Menu
下拉元素1:菜单
<ul class="menu">
<li>
<a href="#" class="btn">+ Add</a>
<ul>
<li><a href="#"><i class="fa fa-file-o"></i> Note</a></li>
<li><a href="#"><i class="fa fa-picture-o"></i> Image</a></li>
<li><a href="#"><i class="fa fa-link"></i> Link</a></li>
</ul>
</li>
</ul>
Dropdown elements 2: Settings1
下拉元素2:Settings1
<ul class="settings1">
<li>
<a href="#"><i class="fa fa-cog"></i></a>
<ul>
<li><a href="#"><i class="fa fa-cog"></i> Account Settings</a></li>
<li><a href="#"><i class="fa fa-sign-out"></i> Sign Out</a></li>
</ul>
</li>
</ul>
JS calls for each: I reference both the classes (menu and settings1) into my dropit.css file.
JS调用每个:我将类(menu和settings1)引用到我的dropit.css文件中。
<script type="text/javascript">
$(".menu").dropit();
$( "#menu" ).click(function() {
$("#left-nav").toggleClass("open", 200);
});
</script>
<script type="text/javascript">
$(".settings1").dropit();
$( "#settings1" ).click(function() {
$("#left-nav").toggleClass("open", 200);
});
</script>
In my .dropit CSS file, I have started the formation of the dropdown but how do I distinctively call either the settings1 or the menu class so I can have different properties for each?
在我的.dropit CSS文件中,我已经开始形成下拉列表但是如何区别地调用settings1或菜单类,以便我可以为每个提供不同的属性?
.dropit {
list-style: none;
padding: 0;
margin: 15px 0 0;
float: right;
display: inline;
}
.dropit .dropit-trigger { position: relative; }
.dropit .dropit-submenu {
position: absolute;
top: 100%;
z-index: 1000;
display: none;
min-width: 100px;
list-style: none;
padding: 20px;
margin: 20px 0 0;
}
1 个解决方案
#1
0
If I'm understanding the question correctly then just apply the CSS directly to .menu
and .settings1
.
如果我正确理解了这个问题,那么只需将CSS直接应用于.menu和.settings1即可。
#1
0
If I'm understanding the question correctly then just apply the CSS directly to .menu
and .settings1
.
如果我正确理解了这个问题,那么只需将CSS直接应用于.menu和.settings1即可。