织梦dedecms二级菜单实现方法

发布:smiling　来源: PHP粉丝网　添加日期：2015-04-04 11:22:17　浏览: 评论：0　

dedecms是支持二级菜单了,但是我们需要分开来做,现在我们稍加改一下就可以实现调用时不需要知道ID即可根据大类小子类了,具体如下.

例子1,修改channelartlist.lib.php,代码如下:

if($typeid==0 || $typeid=='top') {

        $tpsql = " reid=0 AND ispart<>2 AND ishidden<>1 AND channeltype>0 ";

    }

//修改为:

if($typeid=='tops') {

        $tpsql = " reid=0 AND ispart<>2 AND ishidden<>1 ";

    }elseif($typeid==0 || $typeid=='top') {

        $tpsql = " reid=0 AND ispart<>2 AND ishidden<>1 AND channeltype>0 "; //开源软件:phpfensi.com

    }

然后页面调用如下代码:

{dede:channelartlist typeid='tops' row=10}

     <li>

        <a href="{dede:field.typeurl/}">{dede:field.typename/}</a>

                <ul>

                  {dede:channel row='10'}

                        <li><a href='[field:typeurl/]' [field:rel/]>[field:typename/]</a></li>

                    {/dede:channel}

        </ul>

     </li>

{/dede:channelartlist}

例子2,首先在你的css里面加入如下代码:

*

{

    PADDING-BOTTOM: 0px; MARGIN: 0px; PADDING-LEFT: 0px; PADDING-RIGHT: 0px; PADDING-TOP: 0px

}

A {

    text-decoration:none;

}

DIV {

    WORD-WRAP: break-word; WORD-BREAK: break-all

}

LI {

    LIST-STYLE-TYPE: none; LIST-STYLE-IMAGE: none

}

.nav {

    MARGIN: 7px auto 0px; WIDTH: 968px; OVERFLOW: hidden

}

.nav LI {

    FLOAT: left; HEIGHT: 48px

}

.nav_left {

    WIDTH: 8px; BACKGROUND: url(img/s02.gif) no-repeat

}

.nav_center {

    WIDTH: 952px; BACKGROUND: url(img/s03.gif) repeat-x; FONT-SIZE: 16px

}

.nav_right {

    WIDTH: 8px; BACKGROUND: url(img/s04.gif) no-repeat

}

.nav_li_li {

    PADDING-RIGHT: 2px; BACKGROUND: url(img/s05.gif) no-repeat right top

}

.nav A {

    PADDING-BOTTOM: 0px; LINE-HEIGHT: 42px; PADDING-LEFT: 49px; PADDING-RIGHT: 49px; FLOAT: left; HEIGHT: 48px; COLOR: #fff; PADDING-TOP: 0px

}

.nav .nav_on {

    BACKGROUND: url(img/s06.jpg) no-repeat center top; TEXT-DECORATION: none

}

.nav A:hover {

    BACKGROUND: url(img/s06.jpg) no-repeat center top; TEXT-DECORATION: none

}

.nav_li_li DIV {

    Z-INDEX: 1000; BORDER-BOTTOM: #5970b2 1px solid; POSITION: absolute; BORDER-LEFT: #5970b2 1px solid; PADDING-BOTTOM: 5px; MARGIN-TOP: 42px; PADDING-LEFT: 5px; WIDTH: 190px; PADDING-RIGHT: 5px; ZOOM: 1; BACKGROUND: #ffffff 0px 0px; VISIBILITY: hidden; BORDER-TOP: #5970b2 1px solid; BORDER-RIGHT: #5970b2 1px solid; PADDING-TOP: 5px

}

.nav_li_li DIV A {

    POSITION: relative; TEXT-ALIGN: center; PADDING-BOTTOM: 5px; LINE-HEIGHT: 18px; MARGIN: 0px; PADDING-LEFT: 5px; WIDTH: 80px; PADDING-RIGHT: 5px; DISPLAY: block; WHITE-SPACE: nowrap; BACKGROUND: #ffffff 0px 0px; HEIGHT: 18px; COLOR: #2875de; FONT-SIZE: 12px; TEXT-DECORATION: none; PADDING-TOP: 5px

}

.nav_li_li DIV A:hover {

    BACKGROUND: #49a3ff; COLOR: #fff

}

调用js,记得修改路径,代码如下:

dedecms标签实现的方法,代码如下:

<UL class=nav>

  <LI class=nav_left></LI>

  <LI class=nav_center>

  <UL>

    <LI class=nav_li_li><A  href="{dede:global.cfg_cmsurl/}/">首页</A></LI>

    {dede:channelartlist  typeid='top' row='2'}

    <LI class="nav_li_li">

    <A onmouseover="mopen('{dede:field.typeid/}')"   onmouseout=mclosetime() href="{dede:field.typeurl/}">{dede:field.typename/}</A>

    <DIV id={dede:field.typeid/} onmouseover=mcancelclosetime() onmouseout=mclosetime()>

    <A href="{dede:field.typeurl/}">全部分类</A>

    {dede:channel type='son' }

    <A href="[field:typeurl/]">[field:typename/]</A>

{/dede:channel}

</DIV></LI>

    </UL></LI>

  <LI class=nav_right></LI></UL>

js代码,代码如下:

var timeout=500;

var closetimer=0;

var ddmenuitem=0;

function mopen(id)

{

mcancelclosetime();

if(ddmenuitem)ddmenuitem.style.visibility='hidden';

ddmenuitem=document.getElementById(id);

ddmenuitem.style.visibility='visible';

}

function mclose()

{

if(ddmenuitem)ddmenuitem.style.visibility='hidden';

}

function mclosetime()

{

closetimer=window.setTimeout(mclose,timeout);

}

function mcancelclosetime()

{

if(closetimer)

{

window.clearTimeout(closetimer);

closetimer=null;

}

}

document.onclick=mclose;