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

      編輯Tag賺U幣
      教程Tag:暫無Tag,歡迎添加,賺取U幣!
      織夢dedecms 5.7 sp1模板怎么添加下拉菜單
      在織夢dedecms5.5中官方模板里設(shè)置了下拉菜單的顯示,但是之后的幾個版本里面下拉菜單就沒有再用在模板上了。
       
      以下方法將織夢dedecms5.5的下拉菜單移植到5.7sp1中,實現(xiàn)欄目的下拉菜單。
       
      1,首頁導(dǎo)航欄目可以調(diào)用為:
       
      代碼示例:
      1. <div id=”navMenu”> 
      2. <ul> 
      3. <li><a href=”{dede:global.cfg_cmsurl/}/”>首頁</a></li> 
      4. {dede:channel type=’top’ row=’6′ currentstyle=”<li class=’hover’><a href=’~typelink~’ ~rel~>~typename~</a></li>”} 
      5. <li><a href=’[field:typeurl/]‘ [field:rel/]>[field:typename/]</a></li> 
      6. {/dede:channel} 
      7. </ul> 
      8. </div> 
      2,id=”navMenu”這個id是必須有的,在模板中的任何位置添加代碼:
       
      代碼示例:
      1. <script type=’text/javascript’ src=’{dede:global.cfg_cmsurl/}/images/js/dropdown.js’></script> 
      2. {dede:channelartlist typeid=’top’ cacheid=’channelsonlist’}<ul id=”dropmenu{dede:field.typeid/}”> 
      3. {dede:channel type=’son’ noself=’yes’}  <li><a href=”[field:typelink/]“>[field:typename/]</a></li> 
      4. {/dede:channel} 
      5. </ul> 
      6. {/dede:channelartlist} 
      7. <script type=”text/javascript”>cssdropdown.startchrome(“navMenu”)</script> 
      3,在css樣式表中添加:
      1.   
      2. 代碼示例: 
      3. /*——– 下拉菜單 ————–*/ 
      4. .dropMenu { 
      5. position:absolute; 
      6. top: 0; 
      7. z-index:100; 
      8. width: 80px; 
      9. visibility: hidden; 
      10. margin-top: -1px; 
      11. border: 1px solid #003366; 
      12. border-top: 0px solid #3CA2DC; background-color:#FFFFFF; 
      13. padding-top:6px; 
      14. padding-bottom:6px; 
      15. .dropMenu li { 
      16. margin-top:2px; 
      17. margin-bottom:4px; 
      18. padding-left:0px; 
      19. } // www.jbxue.com 
      20. .dropMenu a { 
      21. width: auto; 
      22. display: block; 
      23. color: black; 
      24. padding: 2px 0 2px 1.2em; 
      25. * html .dropMenu a { 
      26. width: 100%; 
      27. .dropMenu a:hover { 
      28. color:red; 
      29. text-decoration: underline; 
      這里css樣式是可以任意調(diào)整的。
       
      完成以上代碼,即可在織夢dedecms5.7sp1模板中添加下拉菜單。
      僅供大家學(xué)習(xí)參考哦~

      查看更多 DedeCms教程  織夢模板  織夢DedeCms視頻教程  織夢dedecms專題

      來源:模板無憂//所屬分類:DedeCms教程/更新時間:2020-05-19
      相關(guān)DedeCms教程