打开APP
userphoto
未登录

开通VIP,畅享免费电子书等14项超值服

开通VIP
ecshop简单三步实现导航商品分类二级菜单
1.在page_header.lbi对应的位置(你想显示导航的位置)插入 (注意下面的 themes/模板名称/util.php中的模板名称改成你模板 文件 夹的名称) ? php require_once(themes/模板名称/util.php); ? div class = h
 1.在page_header.lbi对应的位置(你想显示导航的位置)插入
  (注意下面的"themes/模板名称/util.php"中的"模板名称"改成你模板文件夹的名称)
 
<?php 
    require_once("themes/模板名称/util.php"); 
?> 
<div class="header-menu">  
             <p {if $navigator_list.config.index eq 1} class="cur" {/if}><a href="../index.php">{$lang.home}</a></p>   
                <ul>                   
                  <!-- {foreach name=nav_middle_list from=$navigator_list.middle item=nav} --> 
                   <li onMouseOver="sw_nav(this,1);" onMouseOut="sw_nav(this,0);" {if $nav.active eq 1} class="curs"{/if}> 
                   <a href="{$nav.url}" {if $nav.opennew eq 1}target="_blank" {/if}>{$nav.name}</a> 
                  <?php  
                                  $subcates = get_subcate_byurl($GLOBALS['smarty']->_var['nav']['url']); 
                             if($subcates!=false) 
                        { 
                                if(count($subcates)>0) 
                            { 
                                    echo "<div class='sub_nav'>"; 
                                 
                                if($subcates) 
                                { 
                                foreach($subcates as $cate) 
                                { 
                                        echo "<a href='".$cate['url']."' class='level_1'>".$cate['name']."</a>"; 
                                    
                                } 
                                }                                 
                                echo "</div><iframe frameborder='0' scrolling='no' class='nomask'></iframe>"; 
                            } 
                        } 
                             ?> 
                   </li> 
                 <!-- {/foreach} --> 
            </ul> 
      <script type="text/javascript"> 
      //初始化主菜单 
                function sw_nav(obj,tag) 
                { 
 
                        var subdivs = obj.getElementsByTagName_r("DIV"); 
                        var ifs = obj.getElementsByTagName_r("IFRAME"); 
                         
                        if(subdivs.length>0) 
                        { 
 
                                if(tag==1) 
                                { 
                                        subdivs[0].style.display = "block"; 
                                        ifs[0].style.display = "block"; 
                                } 
                                else 
                                { 
                                        subdivs[0].style.display = "none";         
                                        ifs[0].style.display = "none"; 
                                } 
                                 
                        } 
                } 
 
      </script>  
</div> 
 
2.在CSS文件中插入
 
.header-menu p{ float:left;padding:1px 12px 1px 0;margin-top:-2px;} 
.header-menu  ul li{float:left;padding:1px 12px 1px 12px;margin-top:-2px;} 
.header-menu ul li a,.header-menu p a{color: #333;display:block;} 
.header-menu ul li a:hover,.header-menu p a:hover{color:#888;} 
.header-menu ul li.curs{background:#999;} 
.header-menu ul li.curs a{color:#fff;} 
 
.sub_nav{ background:#999;width:110px; position:absolute; z-index:5003; display:none;margin-left:-12px;} 
.nomask{ background:#fff; width:110px; height:50px; position:absolute; z-index:5002;display:none;margin-left:-12px;} 
.sub_nav a.level_1{ display:block;color:#fff;padding:6px 6px 6px 13px;font:11px Tahoma,Verdana,PMingLiU,Arial;border-bottom:1px dotted #D1D1D1;*border-bottom:1px dotted #D1D1D1 !important;*border-bottom:1px solid #A8A8A8;} 
.sub_nav a.level_1:hover{color:#fff;background:#55B46C;text-decoration:none;} 
3.把以下代码编辑成(util.php)解压出来拷贝到模板目录下
 
 <?php 
 
function get_subcate_byurl($url) 
    $rs = strpos($url,"category"); 
    if($rs!==false) 
    { 
        preg_match("/\d+/i",$url,$matches); 
        $cid = $matches[0]; 
        $cat_arr = array(); 
        $sql = "select * from ".$GLOBALS['ecs']->table('category')." where parent_id=".$cid." and is_show=1"; 
        $res = $GLOBALS['db']->getAll($sql); 
         
        foreach($res as $idx => $row) 
        { 
            $cat_arr[$idx]['id']   = $row['cat_id']; 
            $cat_arr[$idx]['name'] = $row['cat_name']; 
            $cat_arr[$idx]['url']  = build_uri('category', array('cid' => $row['cat_id']), $row['cat_name']); 
            $cat_arr[$idx]['children'] = get_clild_list($row['cat_id']); 
        } 
 
        return $cat_arr; 
    } 
    else  
    { 
        return false; 
    } 
 
function get_clild_list($pid) 
   //开始获取子分类 
    $sql_sub = "select * from ".$GLOBALS['ecs']->table('category')." where parent_id=".$pid." and is_show=1"; 
 
    $subres = $GLOBALS['db']->getAll($sql_sub); 
    if($subres) 
    { 
        foreach ($subres as $sidx => $subrow) 
        { 
            $children[$sidx]['id']=$subrow['cat_id']; 
            $children[$sidx]['name']=$subrow['cat_name']; 
            $children[$sidx]['url']=build_uri('category', array('cid' => $subrow['cat_id']), $subrow['cat_name']); 
        } 
    } 
    else  
    { 
        $children = null; 
    } 
             
    return $children; 
 
?> 
本站仅提供存储服务,所有内容均由用户发布,如发现有害或侵权内容,请点击举报
打开APP,阅读全文并永久保存 查看更多类似文章
猜你喜欢
类似文章
nav代码举例
dedecms5.6织梦建站CSS修改大全
响应式布局案例
HTML5新元素及其特性
兼容多浏览器顶端浮动导航效果
DIV+CSS布局网页的实例
更多类似文章 >>
生活服务
热点新闻
分享 收藏 导长图 关注 下载文章
绑定账号成功
后续可登录账号畅享VIP特权!
如果VIP功能使用有故障,
可点击这里联系客服!

联系客服