js实现鼠标悬浮切换 setTab 代码实现

一款经典的js切换效果、

js代码:

function rashow(name,cursel,n){
    for(i=1;i<=n;i++){
        var menu=document.getElementById(name+i);
        var con=document.getElementById("con_"+name+"_"+i);
        con.style.display=i==cursel?"block":"none";
}

html代码:

<a id="qh1" onmouseover="setTab('qh',1,3)">切换1</a>
<a id="qh2" onmouseover="setTab('qh',2,3)">切换2</a>
<a id="qh3" onmouseover="setTab('qh',3,3)">切换3</a>
 
<div id="con_qh_1" class=layou" style="display:block">
切换内容1
</div>
<div id="con_qh_2" class=layou" style="display:block">
切换内容2
</div>
<div id="con_qh_3" class=layou" style="display:block">
切换内容3
</div>
 
posted @ 2020-03-11 22:34  风灵灵  阅读(774)  评论(0编辑  收藏  举报