关于网站首页二级导航显示的完美解决方案
需要改的地方有2处
1.位于web/skin/default/js/下的tabs.js把里面的内容改为
function tabit(btn){
var idname = new String(btn.id);
var s = idname.indexOf(“_”);
var e = idname.lastIndexOf(“_”)+1;
var tabName = idname.substr(0, s);
var id = parseInt(idname.substr(e, 1));
var tabNumber = btn.parentNode.childNodes.length;
for(i=0;i<tabNumber;i++){
document.getElementById(tabName+”_div_”+i).style.display = “none”;
document.getElementById(tabName+”_btn_”+i).className = “”;
};
document.getElementById(tabName+”_div_”+id).style.display = “block”;
btn.className = “curr”;
};
function etabit(btn8){
var idname = new String(btn8.id);
var s = idname.indexOf(“_”);
var e = idname.lastIndexOf(“_”)+1;
var tabName = idname.substr(0, s);
var id = parseInt(idname.substr(e, 1));
var tabNumber = btn8.parentNode.childNodes.length;
for(i=0;i<tabNumber;i++){
document.getElementById(tabName+”_div_”+i).style.display = “none”;
document.getElementById(tabName+”_btn8_”+i).className = “”;
};
document.getElementById(tabName+”_div_”+id).style.display = “block”;
btn8.className = “curr”;
};
2.打开后台-模板管理-管理模板变量-[!–temp.header–] 和[!–temp.dtheader–]在末尾</table>标记前修改代码如下:
<td><!– 子栏目导航 –>
<div id=tabnav_div_0>……</div>
<div id=tabnav_div_1 style=”DISPLAY: none”>[showclasstemp]1,1,0,0[/showclasstemp]</div>
<div id=tabnav_div_2 style=”DISPLAY: none”>[showclasstemp]2,1,0,0[/showclasstemp]</div>
<div id=tabnav_div_3 style=”DISPLAY: none”>[showclasstemp]3,1,0,0[/showclasstemp]</div>
<div id=tabnav_div_4 style=”DISPLAY: none”>[showclasstemp]4,1,0,0[/showclasstemp]</div>
<div id=tabnav_div_5 style=”DISPLAY: none”>[showclasstemp]5,1,0,0[/showclasstemp]</div>
<div id=tabnav_div_6 style=”DISPLAY: none”>[showclasstemp]6,1,0,0[/showclasstemp]</div>
<div id=tabnav_div_7 style=”DISPLAY: none”>[showclasstemp]7,1,0,0[/showclasstemp]</div>
<div id=tabnav_div_8 style=”DISPLAY: none”>[showclasstemp]8,1,0,0[/showclasstemp]</div>
</td>
修改对象:/skin/default/css/style.css。查找以下代码修改为合适的左边距。最后别忘了刷新一下首页就能看见漂亮的二级导航菜单
——————————————————————————–
/* 子栏目导航菜单距离调整 */
#tabnav_div_1 {
}
#tabnav_div_2 {
padding-left: 100px;
}
#tabnav_div_3 {
padding-left: 200px;
}
#tabnav_div_4 {
padding-left: 300px;
}
#tabnav_div_5 {
padding-left: 400px;
}
#tabnav_div_6 {
padding-left: 500px;
}
#tabnav_div_7 {
padding-left: 600px;
}
#tabnav_div_8 {
padding-right: 40px;
text-align: right;
}
发表评论