織夢dedecms 5.7 sp1模板怎么添加下拉菜單_DedeCms教程

教程Tag：暫無Tag,歡迎添加,賺取U幣!

織夢dedecms 5.7 sp1模板怎么添加下拉菜單
在織夢dedecms5.5中官方模板里設置了下拉菜單的顯示，但是之后的幾個版本里面下拉菜單就沒有再用在模板上了。

以下方法將織夢dedecms5.5的下拉菜單移植到5.7sp1中，實現欄目的下拉菜單。

1，首頁導航欄目可以調用為：

<div id=”navMenu”> 
<ul> 
<li><a href=”{dede:global.cfg_cmsurl/}/”>首頁</a></li> 
{dede:channel type=’top’ row=’6′ currentstyle=”<li class=’hover’><a href=’~typelink~’ ~rel~>~typename~</a></li>”} 
<li><a href=’[field:typeurl/]‘ [field:rel/]>[field:typename/]</a></li> 
{/dede:channel} 
</ul> 
</div>

2，id=”navMenu”這個id是必須有的，在模板中的任何位置添加代碼：

代碼示例:

<script type=’text/javascript’ src=’{dede:global.cfg_cmsurl/}/images/js/dropdown.js’></script> 
{dede:channelartlist typeid=’top’ cacheid=’channelsonlist’}<ul id=”dropmenu{dede:field.typeid/}”> 
{dede:channel type=’son’ noself=’yes’}  <li><a href=”[field:typelink/]“>[field:typename/]</a></li> 
{/dede:channel} 
</ul> 
{/dede:channelartlist} 
<script type=”text/javascript”>cssdropdown.startchrome(“navMenu”)</script>

3，在css樣式表中添加：

  
代碼示例: 
/*——– 下拉菜單 ————–*/ 
.dropMenu { 
position:absolute; 
top: 0; 
z-index:100; 
width: 80px; 
visibility: hidden; 
margin-top: -1px; 
border: 1px solid #003366; 
border-top: 0px solid #3CA2DC; background-color:#FFFFFF; 
padding-top:6px; 
padding-bottom:6px; 
} 
.dropMenu li { 
margin-top:2px; 
margin-bottom:4px; 
padding-left:0px; 
} // www.jbxue.com 
.dropMenu a { 
width: auto; 
display: block; 
color: black; 
padding: 2px 0 2px 1.2em; 
} 
* html .dropMenu a { 
width: 100%; 
} 
.dropMenu a:hover { 
color:red; 
text-decoration: underline; 
}

這里css樣式是可以任意調整的。

完成以上代碼，即可在織夢dedecms5.7sp1模板中添加下拉菜單。
僅供大家學習參考哦~

來源：模板無憂//所屬分類：DedeCms教程/更新時間：2020-05-19

[收藏][報錯][返回列表]

相關DedeCms教程：

織夢dedecms 5.7 sp1模板怎么添加下拉菜單_DedeCms教程

DedeCms教程教程Rss訂閱Cms教程搜索

DedeCms教程推薦

猜你也喜歡看這些