JavaScriptでタブ切り替え効果を実装（自作ネイティブjs）_javascriptスキル

;meta charset=" UTF-8">









ここで、base.css は、
私の CSS フレームワーク、base.css
を指します。

JavaScript コード
:

}
}else if(trigger == 'mouseover'){
tabsBtn[i].onmouseover = function(){
clearClass(); on';
showContent(this.index);
}
}
}
function showContent(n){
for(var i = 0,len = tabsBtn.length; i < len; i ){
tabsContent[i].className = 'hide';
tabsContent[n].className = 'tabs-content'; clearClass() {
for(var i = 0,len = tabsBtn.length; i < len; i ){
tabsBtn[i].className = '';
}
}
}


注:
1. ホームページ、技術、生活、作品などのタイトルは h2 タグ内にあります。
2. on という名前のクラスを使用して現在のタイトルを表示します。selected などの別のクラスに変更する場合は、tabs.js の対応する内容を変更する必要があります。
3. タイトルに該当する内容は p タグ内にあります。 p タグ内にそれ以上の p タグを含めることはできません。
追伸: これらは、暇なときに学んだ JavaScript の知識に基づいて、何気なく書いたエフェクトです。