织梦CMS v5.7 完美实现导航条下拉二级菜单

最新推荐文章于 2023-09-21 15:04:31 发布

chenyujing5678

最新推荐文章于 2023-09-21 15:04:31 发布

阅读量3.9w

点赞数 8

分类专栏： DeDeCMS 文章标签： cms function class include firefox filter

本文链接：https://blog.csdn.net/chenyujing5678/article/details/7870852

版权

本文详细介绍了如何在织梦CMS v5.7中实现导航条的二级下拉菜单。通过在footer.htm文件中添加特定代码，并调整dropdown.js和css文件，可以成功创建并自定义下拉菜单的样式和位置。同时，文章提到了解决下拉菜单透明背景的问题，以及如何通过修改dedecms.css文件调整菜单宽度。

摘要由CSDN通过智能技术生成

转载请标明是引用于 http://blog.csdn.net/chenyujing5678

欢迎拍砖!

一、引言

好多人都问，织梦的下拉导航怎么做呢？其实很简单！即使你对代码一点也不熟悉，没关系！

按照我的步骤走！记住一步也不能错哦！

二、实现过程

1、首先：

将下面这段代码贴到templets\default\footer.htm文件里（只要在此文件里就行，位置无所谓啦！自己看着办！）

 <!-- //二级子类下拉菜单，考虑SEO原因放置于底部 -->
    <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/}" 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>

以上代码可以看出，二级子类下拉菜单是由dropdown.js控制的，我们来看dropdown.js文件：

由以上的cssdropdown.startchrome("navMenu")，可以看出我们调用的是 startchrome:function()

var cssdropdown={
disappeardelay: 250, 
disablemenuclick: false, 
enableswipe: 1, 
enableiframeshim: 1, 
dropmenuobj: null, ie: document.all, firefox: document.getElementById&&!document.all, swipetimer: undefined, bottomclip:0,

getposOffset:function(what, offsettype){
var totaloffset=(offsettype=="left")? what.offsetLeft : what.offsetTop;
var parentEl=what.offsetParent;
while (parentEl!=null){
totaloffset=(offsettype=="left")? totaloffset+parentEl.offsetLeft : totaloffset+parentEl.offsetTop;
parentEl=parentEl.offsetParent;
}
return totaloffset;
},

swipeeffect:function(){
if (this.bottomclip<parseInt(this.dropmenuobj.offsetHeight)){
this.bottomclip+=10+(this.bottomclip/10) 
this.dropmenuobj.style.clip="rect(0 auto "+this.bottomclip+"px 0)"
}
else
return
this.swipetimer=setTimeout("cssdropdown.swipeeffect()", 10)
},

showhide:function(obj, e){
if (this.ie || this.firefox)
this.dropme