简站网

phpcms v9实现首页导航三级下拉的代码

  • 时间:2020-08-09 00:08 来源:简站网 编辑:简站网 阅读:99
  • 扫一扫,手机访问
摘要:phpcmsv9实现首页导航三级下拉的代码,请复制以下代码: html代码: <map>     <ulclass="nav-site">      {pc:contentaction="category"catid=&qu

phpcms v9实现首页导航三级下拉的代码,请复制以下代码:

html代码:

<map>

        <ul class="nav-site">

         {pc:content action="category" catid="0" num="25" siteid="$siteid" order="listorder ASC"}

        <li><a href="{siteurl($siteid)}"><span>首页</span></a></li>

        <li class="line">|</li>

        {loop $data $k $v}

             <li><a href="{$v[url]}">{$v[catname]}

             <!--[if IE 7]><!--></a><!--<![endif]-->

             <!--[if lte IE 6]><table><tr><td><![endif]-->

             <ul>

            {pc:content action="category" catid="$k" num="10" siteid="$siteid" order="listorder ASC"}

                {loop $data $b $d}

                    <li><a href="{$d[url]}">{$d[catname]}

                    <!--[if IE 7]><!--></a><!--<![endif]-->

                    <!--[if lte IE 6]><table><tr><td><![endif]-->

                     

                        <ul class="nav-site22">

                        {pc:content action="category" catid="$b" num="10" siteid="$siteid" order="listorder ASC"}

                            {loop $data $r}

                                <li><a href="{$r[url]}">{$r[catname]}</a></li>

                            {/loop}

                        {/pc}

                         </ul>

                    </li>

                         

                {/loop}

            {/pc}

             </ul>

           <!--[if lte IE 6]></td></tr></table></a><![endif]-->

           </li>

           <li class="line">|</li>

       {/loop}

   {/pc}

   </ul>

        {php echo runhook('glogal_menu')}

        </map>

 

 

css样式表:

.nav-site{

list-style:none;}

.nav-site li {position:relative; z-index:10;margin-left:0px !important;}

.nav-site ul {visibility:hidden;position:absolute;left:0px;top:30px;}

.nav-site table {position:absolute; top:0; left:0;}

.nav-site li:hover>ul,

.nav-site a:hover ul{visibility:visible;}

.nav-site a:hover{background:#3a6ea5;color:#ffffff;}

.nav-site ul{  }

.nav-site ul a{background-color:#FFF100;color:#333333;border-top:1px solid #7aa5d2;

border-bottom:1px solid #4e6a87;text-decoration:none;}

.nav-site ul li {clear:both;height:28px !important; line-height:28px !important; text-align:center;font-size:13px;list-style: none; }

.nav-site ul li a{display:block;width:138px;}

.nav-site ul li a:hover{ border-top:1px solid #7aa5d2;

border-bottom:1px solid #4e6a87;color:#ffffff;background:#6d93bc;}

 

.nav-site22{list-style:none;margin-left:137px;}

.nav-site22 li {position:relative; z-index:30;padding-lef:0px;bottom: 30px;}

.nav-site22 ul {visibility:hidden;position:absolute;left:0px;top:0px !important;}

.nav-site22 table {position:absolute; top:0px; left:3px;}

.nav-site22 li:hover> ul{visibility:visible;}

.nav-site22 a:hover >ul{visibility:visible;}

.nav-site22 a:hover{background:#3a6ea5;}

.nav-site22 ul{  }

.nav-site22 ul a{

background-color:#FFF100;color:#ffffff;border-top:1px solid #7aa5d2;border-bottom:1px solid #4e6a87;

text-decoration:none;}

.nav-site22 ul li {clear:both;height:38px !important; line-height:38px !important; text-align:center;font-size:13px;list-style: none;margin-top:10px; }

.nav-site22 ul li a{display:block;width:138px;}

.nav-site22 ul li a:hover{ border-top:1px solid #7aa5d2;border-bottom:1px solid #4e6a87;background:#6d93bc;}

 

该方法建站魔盒已在phpcms官网论坛贴出正解!http://bbs.phpcms.cn/forum.php?mod=viewthread&tid=932284&page=1#pid3135092

 

 

 

 

 

 

 

  • 全部评论(0)
资讯详情页最新发布上方横幅
最新发布的资讯信息
【CMS教程|discuz】Discuz!X3关闭登录IP异常提醒的方法(2020-09-20 11:09)
【CMS教程|phpcms】[补 丁] 【重要】phpcms v9全系列 利用篡改模板路径生成任意文件的漏洞 - 修复方法(2020-09-20 10:09)
【运营推广|网站运营】贴吧该怎么做搜索引擎优化,这里分享两招(2020-09-20 10:09)
【源码下载|网站源码】200大洋买的个人商城源码(2020-09-20 04:09)
【源码下载|网站源码】搭建emlog资源吧模版源码(2020-09-20 03:09)
【源码下载|网站源码】优客365网址导航商业精华版1.1.6源码(2020-09-20 02:09)
【源码下载|网站源码】用饭局办成自事的操作指南(2020-09-20 02:09)
【运营推广|微信营销】想通过微信公众号赚钱?先确定自己的运作模式(2020-09-20 01:09)
【源码下载|网站源码】PanDownload网页版源码(2020-09-20 00:09)
【源码下载|网站源码】精fa某某商城源码仅供参考(2020-09-20 00:09)