CSS代码有点小多我就没有贴进去了,实在中心代码就那多少句,次要为了仿造得圆满就得多写小半啦!有兴味的同窗间接键入我的源码钻研。
中心JavaScript代码:
类名为“active”的蓝色列表标签示意载入时的默许菜单项。
实在也算没有上教程,也就是本人没事儿的时分做点货色而后发下去自己交换交换,指望自己没有吝赐教^!^
。
类名为“sub-item”列表标签ul的id属性顺次类加就OK了,如:sub-item1,sub-item2,sub-item3…
菜单项是能够自正在扩大的,大前提是复制代码中类名为“sub-item”白色列表标签。
留意:
</div>
</div>
</ul>
<li class="ext2"></li><!–额定的标签用来定位菜单项右下圆角 –>
<li><a href="#"><span>Flash</span></a></li>
<li><a href="#"><span>Fireworks</span></a></li>
<li><a href="#"><span>Photoshop</span></a></li>
<li><a href="#"><span>ActionScript</span></a></li>
<li><a href="#"><span>JavaScript</span></a></li>
<li><a href="#"><span>CSS</span></a></li>
<li><a href="#"><span>HTML</span></a></li>
<ul class="sub-item" id="sub-item1">
<div id="bot"><!–灰骰子菜单项全体:此标签作用也正在于滑行门成效的完成–>
</div>
</ul>
<li class="ext1"></li><!–额定的标签用来定位菜单项右上圆角 –>
<li id="item7"><a href="#"><span>商家效劳</span></a></li>
<li id="item6"><a href="#"><span>保险核心</span></a></li>
<li id="item5"><a href="#"><span>我的领取宝</span></a></li>
<li id="item4"><a href="#"><span>买卖治理</span></a></li>
<li id="item3"><a href="#"><span>网站开拓</span></a></li>
<li id="item2" class="active"><a href="#"><span>我要付款</span></a></li>
<li id="item1"><a href="#"><span>前者开拓</span></a></li>
<ul id="item"><!–列表项li可自正在增添与修正 –>
<div id="top"><!–杏黄菜单项全体:此标签作用正在于滑行门成效的完成—>
<div id="menu">
中心HTML代码如次:
由于刚刚看过亚东的教程和某个有点类似,因为就本人揣摩了一下写了一度仅用到一小段的JS就搞定了。
}
}
}
}
}
nodeSubItem.style.display = "none";
}else{
nodeSubItem.style.display = "block";
if ( linkNode == j ){ //假如菜单项和菜单形式婚配则显现,要不躲藏
var nodeSubItem = document.getElementById("sub-item"+j);
for ( j=1; j<10; j++){ //按次第婚配菜单项和菜单形式
var linkNode = parseInt( this.id.substring(4,5) );
this.className = "active";
}
//alert(this.className);
document.getElementsByTagName("li")[n].className = "";
for( n=0; n<6; n++){
/*菜单激运动态款式*/
nodeItem.onclick = function() {
var nodeItem = document.getElementById("item"+i); //遍历每个菜单项增多 onClick事情
for( i=1; i<8; i++ ){
window.onload = function() {
次要性能是:子菜单项随着菜单项变迁而变迁的成效(相似tab选项卡)。有什么成绩间接给我挥笔^!^(义务编者:帝位库)
JS代码就没有多做注释了,主要全体我曾经给出诠释。亚东的外面要用到JQuery。由于我也是菜鸟,费了很大劲才完成成效,还指望高手多多指导。也就是copy某个ul标签的一切形式粘贴其后就行。我觉得要是容易小半的货色间接上JS就行了,有少量需要时再调用库才好。