DeDeCMS中如何实现下拉菜单

在5.7版本，已经有比较简单的方法实现下拉菜单，我们可以用它已有方法，也可以用我写的第二种方法来实现

1. 在需要下拉菜单的地方加入以下代码

  <div id="navMenu"><ul><li><a href="{dede:global.cfg_indexurl/}">首页</a></li>                                                                    {dede:channel row='10' typeid="13"}    <li><a href="[field:typeurl/]"[field:rel/]>[field:typename/]</a></li></li>                                                                    {/dede:channel}</ul></div>

在页面底部加入以下代码

<script type='text/javascript' src='{dede:global.cfg_cmsurl/}/images/js/dropdown.js'></script>{dede:channelartlist typeid='13' cacheid='channelsonlist'}    <ul id="dropmenu{dede:field.typeid/}" class="dropMenu">       {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>

再加入以下样式

<style type="text/css">.dropMenu {position: absolute;top: 0;z-index: 100;width: 80px;visibility: hidden;filter: progid:DXImageTransform.Microsoft.Shadow(color=#CACACA,direction=135, strength=4);margin-top: -1px;border: 3px solid #FF0000;border-top: 0px solid #3CA2DC;background-color: #FFF;background: url(templets/sdgwy/index_files/mmenubg.gif);padding-top: 6px;padding-bottom: 6px;}.dropMenu li {margin-top: 2px;margin-bottom: 4px;padding-left: 6px;}.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;}</style>

这样就可以出二级菜单了，你需要自己再调一下显示样式

<nav id="navigation" class="navigation clearfix"><ul class="clearfix"><li class='active'><a href="{dede:global.cfg_indexurl/}/" rel=“nofollow”>首页</a></li>{dede:channelartlist typeid='13'}<li><a href='{dede:field name='typeurl'/}'>{dede:field name='typename'/}</a><ul> {dede:sql sql='Select * from dede_arctype where reid=~id~  ORDER BY id limit 0,17'} <li><a href='[field:typeurl/]'>[field:typename/]</a></li> {/dede:sql} </ul></li>{/dede:channelartlist}</ul><div class="widget_social clearfix"><ul class="social-icons clearfix"><li class="facebook"><a href="#">Facebook<span></span></a></li><li class="twitter"><a href="#">Twitter <span></span></a></li><li class="rss"><a href="#">Rss <span></span></a></li><li class="youtube"><a href="#">YouTube <span></span></a></li></ul><!--/ .social-icons--></div><!--/ .widget_social--></nav><!--/ #navigation-->

这样就生成出

<ul>

<li>

<ul>

<li></li>

</ul>

</li>

</ul>

这样的结构，然后网上随便搞个jquery的下拉菜单的代码都可以实现漂亮的下拉菜单了

没有早一步，也没有晚一步，刚好遇上了你！