我需要在此下拉菜单中添加第三级。这是来自Blogger模板的代码,在这里我可以在主菜单中仅具有第一级和第二级。
还有一个Javascript,它允许Blogger识别出这是第二级菜单(实际上,当我想在第二级菜单中放置文字时,我需要在文字前添加“ _”,然后它将自动进入第二级)。
我曾经有另一个模板,可以在第三级中添加文本,只需在文本之前添加“ __”即可。但是代码是加密的,所以我无法复制它。
我希望可以在文本(例如__books)前使用命令“ __”添加第三级,而不必每次都在HTML工作表中进行操作(实际上,使用此javascript,Blogger会自动创建下拉菜单HTML中的向下菜单顺序。
可以帮我吗?
这是CSS:
/* Main Menu
=========================== */
#LinkList60 {
display:none;
}
.menu-display {
display:block !important;
}
.menu-opacity {
z-index: 9999;
position: relative;
}
.main-menu {
border-bottom: 1px solid $(mainnav.border);
border-top: 1px solid $(mainnav.border);
}
.menu-opacity .main-menu {
border-top: 0;
}
.main-menu {
text-align:center;
float:none;
background-color:$(mainnav.bg.color);
letter-spacing: 1px;
}
.main-menu ul li ul {
z-index:998;
}
.main-menu > ul > li {
float:none;
display:inline-block;
line-height:50px;
position:relative;
list-style:none;
}
.main-menu > ul > li:last-child {
margin-right:0;
}
.main-menu > ul > li > a {
padding:10px 20px;
display:inline-block;
line-height:50px;
font:$(mainnav.font);
color:$(mainnav.text.color);
text-transform: uppercase;
letter-spacing: 2px;
}
.main-menu > ul > li > a:hover {
color:$(mainnav.hover.color);
}
.main-menu > ul > li:hover > ul {
display:block;
top:50px;
background-color:$(dropdown.bg.color);
}
.main-menu ul > li ul {
display:none;
position:absolute;
left:0;
top:100%;
z-index:993;
width:200px;
border: 1px solid rgba(0, 0, 0, 0.1);
text-transform: uppercase;
}
.main-menu li ul li a {
height:inherit;
float:inherit;
text-align:left;
display:block;
margin:0!important;
padding:0 15px;
z-index:993;
border-bottom:1px solid rgba(0, 0, 0, 0.1);
font:$(dropdown.font);
color:$(dropdown.font.color);
line-height:38px;
}
.main-menu li ul li:last-child a {
border-bottom:none
}
.main-menu li a i {
margin-left:5px
}
.main-menu li ul li a:hover {
background-color:$(dropdown.bg.colorhover);
}
.main-menu > ul > li:hover li:hover > a {
color:$(dropdown.font.colorhover);
}
这是Javascript:
<script type='text/javascript'>
//<![CDATA[
$("#LinkList60").each(function(){$(this).addClass('main-menu');var e="<ul id='nav'><li><ul class='sub-menu'>";
$("#LinkList60 li").each(function(){var t=$(this).text(),n=t.substr(0,1),r=t.substr(1);"_"==n?(n=$(this).find("a").attr("href"),e+='<li><a href="'+n+'">'+r+"</a></li>"):(n=$(this).find("a").attr("href"),e+='</ul></li><li><a href="'+n+'">'+t+"</a><ul class='sub-menu'>")});e+="</ul></li></ul>";$(this).html(e);
$("#LinkList60 ul").each(function(){var e=$(this);if(e.html().replace(/\s| /g,"").length==0)e.remove()});
$("#LinkList60 li").each(function(){var e=$(this);if(e.html().replace(/\s| /g,"").length==0)e.remove()});
$('#LinkList60 a').each(function(){var page_url=$(location).attr('href'),link=$(this).attr('href');if(link===page_url){var id=$(this).parents(':eq(1)').attr('id');if(id==='nav'){$(this).parent('li').addClass('current')}else{$(this).parents(':eq(2)').addClass('current')}}});
$('.sub-menu').prev('a').append("<i class='fa fa-angle-down'/>");});
//]]>
</script>
这是Blogger使用javascript自动构建的菜单:
<b:section class='mmenu' id='mmenu' maxwidgets='1' showaddelement='no'>
<b:widget id='LinkList60' locked='true' title='Main Menu' type='LinkList' version='1'>
<b:widget-settings>
<b:widget-setting name='text-10'><![CDATA[_History & Archaeology]]></b:widget-setting>
<b:widget-setting name='sorting'>NONE</b:widget-setting>
<b:widget-setting name='link-1'>https://loveculturelanguage.blogspot.com/search/label/Love</b:widget-setting>
<b:widget-setting name='link-13'>https://loveculturelanguage.blogspot.com/search/label/English</b:widget-setting>
<b:widget-setting name='link-2'>https://loveculturelanguage.blogspot.com/search/label/Pensieri</b:widget-setting>
<b:widget-setting name='link-12'>https://loveculturelanguage.blogspot.com/search/label/Language</b:widget-setting>
<b:widget-setting name='link-0'>https://loveculturelanguage.blogspot.com</b:widget-setting>
<b:widget-setting name='link-14'>https://loveculturelanguage.blogspot.com/search/label/%E6%97%A5%E6%9C%AC%E8%AA%9E</b:widget-setting>
<b:widget-setting name='link-11'>https://loveculturelanguage.blogspot.com/search/label/Cinema</b:widget-setting>
<b:widget-setting name='link-10'>https://loveculturelanguage.blogspot.com/search/label/History%20%26%20Archaeology</b:widget-setting>
<b:widget-setting name='text-9'>_Folklore</b:widget-setting>
<b:widget-setting name='link-9'>https://loveculturelanguage.blogspot.com/search/label/Folklore</b:widget-setting>
<b:widget-setting name='text-8'>_Art</b:widget-setting>
<b:widget-setting name='link-7'>https://loveculturelanguage.blogspot.com/search/label/Books%20%26%20Literature</b:widget-setting>
<b:widget-setting name='link-8'>https://loveculturelanguage.blogspot.com/search/label/Art</b:widget-setting>
<b:widget-setting name='link-5'>https://loveculturelanguage.blogspot.com/search/label/Woman</b:widget-setting>
<b:widget-setting name='link-6'>https://loveculturelanguage.blogspot.com/search/label/Culture</b:widget-setting>
<b:widget-setting name='link-3'>https://loveculturelanguage.blogspot.com/search/label/Travels</b:widget-setting>
<b:widget-setting name='link-4'>https://loveculturelanguage.blogspot.com/search/label/Photography</b:widget-setting>
<b:widget-setting name='text-1'>Love</b:widget-setting>
<b:widget-setting name='text-0'>Home</b:widget-setting>
<b:widget-setting name='text-3'>_Travels</b:widget-setting>
<b:widget-setting name='text-2'>_Pensieri</b:widget-setting>
<b:widget-setting name='text-5'>_Woman</b:widget-setting>
<b:widget-setting name='text-4'>_Photography</b:widget-setting>
<b:widget-setting name='text-7'><![CDATA[_Books & Literature]]></b:widget-setting>
<b:widget-setting name='text-6'>Culture</b:widget-setting>
<b:widget-setting name='text-11'>_Cinema</b:widget-setting>
<b:widget-setting name='text-12'>Language</b:widget-setting>
<b:widget-setting name='text-13'>_English</b:widget-setting>
<b:widget-setting name='text-14'>_日本語</b:widget-setting>
</b:widget-settings>
<b:includable id='main'>
<div class='widget-content'>
<ul>
<b:loop values='data:links' var='link'>
<li><a expr:href='data:link.target'><data:link.name/></a></li>
</b:loop>
</ul>
</div>
</b:includable>
</b:widget>
</b:section>
非常感谢您。