织梦带二级栏目的导航菜单高亮显示
织梦带二级栏目的导航菜单高亮显示,下面代码未精简。
织梦模板代码如下:
<style>.mrdede_all{display:none}@media (max-width: 768px) {.mrdede_all{display:block;}}</style>
{dede:channelartlist typeid='top' currentstyle='active'}
{dede:field name='typeurl' runphp='yes'}global $GLOBAL;$GLOBAL['typeurl']=@me;@me='';{/dede:field}
<li class="dropdown margin-left-20">
<a href="{dede:field name='typeurl'/}" title="{dede:field name='typename'/}"
{dede:field name='typeid' runphp='yes'}
global $dsql,$tid;
if(@me==$tid){
$type = " class='dropdown-toggle link active'";
}else{
$row = $dsql->GetOne("SELECT id FROM `#@__arctype` WHERE (`id`=$tid AND `reid`=@me) OR (`id`=@me AND `reid`=$tid)");
$type=is_array($row)?" class='dropdown-toggle link active'":" class='dropdown-toggle link'";
}
$row = $dsql->GetOne("SELECT id,reid FROM `#@__arctype` WHERE reid=@me AND ishidden<>1 ORDER BY sortrank ASC LIMIT 0, 100");
$type2=is_array($row)?'data-toggle="dropdown" data-hover="dropdown" aria-expanded="false" role="button"':'';
@me = $type . ' ' . $type2;
{/dede:field}>
{dede:field name='typename'/}
{dede:field name=typeid runphp='yes'}
global $dsql,$tid,$GLOBAL;
$_str = @me==$tid?'active':'';
$row = $dsql->GetOne("SELECT typename FROM `#@__arctype` WHERE id=@me AND ishidden<>1 ORDER BY sortrank ASC LIMIT 0, 100");
$row2 = $dsql->GetOne("SELECT id,typename FROM `#@__arctype` WHERE reid=@me AND ishidden<>1 ORDER BY sortrank ASC LIMIT 0, 100");
@me=is_array($row2)?'<i class="fa fa-angle-down small"></i></a><ul class="dropdown-menu dropdown-menu-right bullet" role="menu"><li class="mrdede_all"><a href="'.$GLOBAL['typeurl'].'" class="'.$_str.'">'.$row['typename'].'</a></li>':'</a>';
{/dede:field}
{dede:channel}
<li><a href="[field:typelink/]" title="[field:typename/]" class="[field:id runphp='yes']global $tid;@me=@me==$tid?'active':'';[/field:id]">[field:typename/]</a></li>
{/dede:channel}
{dede:field name=typeid runphp='yes'}
global $dsql;
$row = $dsql->GetOne("SELECT id FROM `#@__arctype` WHERE reid=@me AND ishidden<>1 ORDER BY sortrank ASC LIMIT 0, 100");
@me=is_array($row)?'</ul>':'';
{/dede:field}
</li>
{/dede:channelartlist}
上面的代码,在内容页时不显示高亮,所以修改后,如下:
<li><a href="/" title="网站首页" {dede:field name=typeid runphp="yes" }(@me=="")?
@me=" class='link active'" :@me="" ;{/dede:field}>网站首页</a></li>
<style>.mrdede_all{display:none}@media (max-width: 768px) {.mrdede_all{display:block;}}</style>
{dede:channelartlist typeid='top' currentstyle='active'}
{dede:field name='typeurl' runphp='yes'}global $GLOBAL;$GLOBAL['typeurl']=@me;@me='';{/dede:field}
<li class="dropdown margin-left-20">
<a href="{dede:field name='typeurl'/}" title="{dede:field name='typename'/}"
{dede:field name='typeid' runphp='yes'}
global $dsql,$tid,$arc;
$tid=empty($tid)?$arc->Fields['typeid']:$tid;
if(@me==$tid){
$type = " class='dropdown-toggle link active'";
}else{
$row = $dsql->GetOne("SELECT id FROM `#@__arctype` WHERE (`id`=$tid AND `reid`=@me) OR (`id`=@me AND `reid`=$tid)");
$type=is_array($row)?" class='dropdown-toggle link active'":" class='dropdown-toggle link'";
}
$row = $dsql->GetOne("SELECT id,reid FROM `#@__arctype` WHERE reid=@me AND ishidden<>1 ORDER BY sortrank ASC LIMIT 0, 100");
$type2=is_array($row)?'data-toggle="dropdown" data-hover="dropdown" aria-expanded="false" role="button"':'';
@me = $type . ' ' . $type2;
{/dede:field}>
{dede:field name='typename'/}
{dede:field name=typeid runphp='yes'}
global $dsql,$tid,$GLOBAL;
$_str = @me==$tid?'active':'';
$row = $dsql->GetOne("SELECT typename FROM `#@__arctype` WHERE id=@me AND ishidden<>1 ORDER BY sortrank ASC LIMIT 0, 100");
$row2 = $dsql->GetOne("SELECT id,typename FROM `#@__arctype` WHERE reid=@me AND ishidden<>1 ORDER BY sortrank ASC LIMIT 0, 100");
@me=is_array($row2)?'<i class="fa fa-angle-down small"></i></a><ul class="dropdown-menu dropdown-menu-right bullet" role="menu"><li class="mrdede_all"><a href="'.$GLOBAL['typeurl'].'" class="'.$_str.'">'.$row['typename'].'</a></li>':'</a>';
{/dede:field}
{dede:channel}
<li><a href="[field:typelink/]" title="[field:typename/]" class="[field:id runphp='yes']global $tid,$arc;$tid=empty($tid)?$arc->Fields['typeid']:$tid;@me=@me==$tid?'active':'';[/field:id]">[field:typename/]</a></li>
{/dede:channel}
{dede:field name=typeid runphp='yes'}
global $dsql;
$row = $dsql->GetOne("SELECT id FROM `#@__arctype` WHERE reid=@me AND ishidden<>1 ORDER BY sortrank ASC LIMIT 0, 100");
@me=is_array($row)?'</ul>':'';
{/dede:field}
</li>
{/dede:channelartlist}
上面的还是不够完美,因为客户发现文章页没有高亮显示,下面把文章模板页单独使用头模板head2.htm,使用前端JS来配合高亮显示,源码如下:
<ul class="nav navbar-nav navbar-right navlist">
<li>
<a href="/" title="网站首页">网站首页</a></li>
<style>.mrdede_all{display:none}@media (max-width: 768px) {.mrdede_all{display:block;}}</style>
{dede:channelartlist typeid='top'}
{dede:field name='typeurl' runphp='yes'}global $GLOBAL;$GLOBAL['_typeurl']=@me;@me='';{/dede:field}
<li class="dropdown margin-left-0">
<a id="top_menu_{dede:field.id/}" href="{dede:field name='typeurl'/}" title="{dede:field name='typename'/}"
class="dropdown-toggle link"
{dede:field name='typeid' runphp='yes'}
global $dsql,$GLOBAL;
$row = $dsql->GetOne("SELECT id,reid FROM `#@__arctype` WHERE reid=@me AND ishidden<>1 ORDER BY sortrank ASC LIMIT 0, 100");
$_str = (is_array($row)?' data-toggle="dropdown" data-hover="dropdown" aria-expanded="false" role="button"':'') . '>';
$row = $dsql->GetOne("SELECT typename FROM `#@__arctype` WHERE id=@me AND ishidden<>1 ORDER BY sortrank ASC LIMIT 0, 100");
$_str .= $row['typename'];
$sons = GetSonIds(@me,0,false);
$_str .= !empty($sons)?' <i class="fa fa-angle-down small"></i></a><ul class="dropdown-menu dropdown-menu-right bullet" role="menu"><li class="mrdede_all"><a href="'.$GLOBAL['_typeurl'].'">'.$row['typename'].'</a></li>':'</a>';
@me = $_str;
{/dede:field}
{dede:channel type='son'}
<li><a class="son_menu" code="[field:id/]" top-code="[field:id runphp=yes]@me=(GetTopid(@me));[/field:id]" href="[field:typelink/]" title="[field:typename/]">[field:typename/]</a></li>
{/dede:channel}
{dede:field name='typeid' runphp='yes'}
$row = GetSonIds(@me,0,false);
$tof=!empty($row)?'</ul>':'';
@me = $tof;
{/dede:field}
</li>
{/dede:channelartlist}
</ul>
<input type="hidden" id="tid" value="{dede:field.typeid/}">
<script type="text/javascript">
function addClass(obj, cls){
var obj_class = obj.className,
blank = (obj_class !== '') ? ' ' : '';
added = obj_class + blank + cls;
obj.className = added;
}
var tid = document.getElementById('tid').value,
son_menu = document.getElementsByClassName('son_menu');
for (var i = 0; i < son_menu.length; i++) {
var code = son_menu[i].getAttribute('code');
if(tid === code){
addClass(son_menu[i], 'active'); // 当前文章的栏目高亮
var tops_code = son_menu[i].getAttribute('top-code');
addClass(document.getElementById('top_menu_' + tops_code), 'active');
}
}
</script>
发表评论
木有头像就木JJ啦!还木有头像吗?点这里申请属于你的个性Gravatar头像吧!