COVID-19【新冠病毒、武漢肺炎】即時資訊:全球疫情台灣疫情
目前位置: 首頁 > ECSHOP響應式模版設計 > ecshop 中間導航

ecshop 中間導航 超大 稍大 微大

發表於: 2013-04-25 最後更新: 現在時間:2021-02-26 01:03:14
對每個網站來說都很重要,ecshop 的中間導航位於  library/page_header.lbi 內,程式碼類似:
<div id="mainNav" class="clearfix">
  <a href="../index.php"{if $navigator_list.config.index eq 1} class="cur"{/if}>{$lang.home}<span></span></a>
  <!-- {foreach name=nav_middle_list from=$navigator_list.middle item=nav} -->
  <a href="{$nav.url}" {if $nav.opennew eq 1}target="_blank" {/if} {if $nav.active eq 1} class="cur"{/if}>{$nav.name}<span></span></a>
 <!-- {/foreach} -->
</div>

和頂部導航一樣,你也可以把程式碼獨立出來做為一個新樣版,如: mainNav.lbi ,然後在 library/page_header.lbi 用 {include file='library/mainNav.lbi'} 來調用,這樣 library/page_header.lbi 的程式碼就會顯得更簡潔,以後維護起來也會很方便,由於中間導航的選單項目可能偏多,很多人會不熄修改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;
}

?>
<div id="header-menu" class="block">
<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><div class='nomask'></div>";
}
}
?>
</li>
<!-- {/foreach} -->
</ul>
</div>
<script type="text/javascript">
//初始化主菜單
function sw_nav(obj,tag){
var subdivs = obj.getElementsByTagName("DIV");
var ifs = obj.getElementsByTagName("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>
<style type="text/css">
    /*頁面主導航*/
#header-menu{padding:0 25px; width:910px;overflow:hidden;}
#header-menu p, #header-menu ul li{float:left;}
#header-menu ul li a,#header-menu p a{background:url(images/coffee/NavBg.gif) no-repeat 0 -29px; color: #666;display:block;text-decoration:none;line-height:25px;padding:0 10px;}
#header-menu ul li a:hover,#header-menu p a:hover{color:#333;background:url(images/middle_hover.gif);}
#header-menu ul li.curs a{color:#f00;background:url(images/middle_bg.gif);}
/*子選單*/
.sub_nav{ background:#ccc url(images/middle_bg.gif);min-width:100px;height:auto;line-height:30px; position:absolute; z-index:5003; display:none;}
.nomask{ position:absolute; z-index:5002;display:none;margin-left:-12px;height:25px;}
/*使用垂直選單請將 float:left; 註解掉*/
.sub_nav a.level_1{ float:left;display:block;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;text-decoration:none;background:url(images/middle_atv.gif);}
.sub_nav a.level_1:hover{text-decoration:none;}
</style>
對於本站文章有任何問題或建議歡迎到 : 討論區寫信給我
本站提供ECSHOP技術支援, 是網路開店最佳選擇 ,最後更新時間: 現在時間:2021-02-26 01:03:14