亚洲在线久爱草,狠狠天天香蕉网,天天搞日日干久草,伊人亚洲日本欧美

{
??? //方法一。代碼最簡潔。JQuery方式。記得head里加上jquery引用哦。
?? /*-----
??? ?$("p").on("click",function(){
??? ???? $(this).next().slideToggle(500);??
??})
?}
-----*/
?//方法二。效果：同方法一，點擊后之前展開的p不折疊 。
??? /*---
??? var ps=document.getElementsByTagName("p");
????? var uls=document.getElementsByTagName("ul");

? if(ps.length=uls.length){
???? for(i=0;i<ps.length;i++){
??????? ps[i].id=i;
??????? ps[i].onclick=function(){
??????????? if(uls[this.id].style.display=="block"){
??????????? uls[this.id].style.display="none";???
??????????? }
??????????? else{
??????????? uls[this.id].style.display="block";???
??????????? }
??????? }
???? }
?? }
}
----*/
//方法三。效果：折疊。
??? var p=document.getElementById("menu").getElementsByTagName("p");
?var ul=document.getElementById("menu").getElementsByTagName("ul");
? ? for(i=0;i<p.length;i++)
??? {
??p[i].aa=i;
??p[i].onclick=function()
??????? {
???for(j=0;j<ul.length;j++)
??????????? {
????ul[j].style.display="none";
???? }
????????? ul[this.aa].style.display="block";
??}
?}
}

tab切換分為四類：劃過切換；點擊切換；延遲切換；自動切換；

tab選項卡的學習 在js中還有遮罩層

網頁特效

Ok

選項卡

// 封裝id函數 function $(id) { return typeof id === 'string' ? document.getElementById(id) : id; } //加載 window.onload = function() { var index = 0; var timer = null; var titles = $("notice-title").getElementsByTagName("li"); var divs = $("notice-content").getElementsByTagName("div"); if(titles.length != divs.length) return; for(var i = 0; i < titles.length; i++) { titles[i].id = i; titles[i].onmouseover = function() { // 如果存在準備執行的定時器，立刻清除，只有當前停留時間大于500ms時才開始執行 if(timer){ clearTimeout(timer); timer=null; } timer = setTimeout(() => { for(var j = 0; j < titles.length; j++) { titles[j].className = ""; divs[j].style.display = "none"; } this.className = "select"; divs[this.id].style.display = "block"; }, 400) } } }