選項卡效果

2021-08-02 17:21:50 字數 1440 閱讀 5524

html

>

<

html 

lang=

"en"

>

<

head

>

<

meta 

charset=

"utf-8"

>

<

title

>title

title

>

<

style

>

* #main 

span 

p .active 

style

>

head

>

<

body

>

<

div 

id="main"

>

<

span 

class=

"active"

>第乙個

span

>

<

span

>第二個

span

>

<

span

>第三個

span

>

<

p class=

"active"

>第乙個文字

p>

<

p>第二個文字

p>

<

p>第三個文字

p>

div>

body

>

html

>

<

script

>

var 

ospan = document.getelementsbytagname("span");//  獲取dom物件

var 

op = document.getelementsbytagname("p");//  獲取dom物件

for(var 

i = 0;i

this.

classname = 

"active"; 

//事件監聽處理程式中,this 就是指當前事件監聽的物件;

op[ this.

index].

classname = 

"active";

//ospan[0].index = 0;ospan[1].index = 1;ospan[2].index = 2;所以this.index = i;i的值就是this的索引值;}

} //我們乙個完整事件分為 事件監聽 和 事件的觸發 兩個過程

// 我們的dom0級事件屬性,是繫結在我們的dom物件的上私有屬性;

// 因為他是乙個屬性,所以我們乙個dom0級事件只能賦值乙個處理方法

script

>

js,選項卡效果

css樣式 parent parent span wrap span wrap span span wrap span.focus ul wrap ul wrap ul ul wrap ul first child ul wrap ul li ul wrap ul li ajs樣式 function...

選項卡套選項卡

實現 項卡套小選項卡 項卡切換同時小選項卡也進行切換,且每次 項卡的切換是在小選項卡切換完後進行 大的外層的選項卡 大的選項卡內部有乙個小的選項卡 功能 自動切換 滑鼠經過切換 方案一 不可行 開兩個定時器,乙個控制外層選卡,乙個控制內層選卡。仔細分析發現,外層選項卡的切換是需要在內層選卡全部切換完...

選項卡tab滑動效果 slide切換選項卡

p 各種下拉列表,導航,多級選單,右側展開,左側展開 p div div h2class title slide 3 h2 p tab標籤,選項卡,選卡,jquery選項卡,標籤頁,動態載入tab p div div h2class title slide 4 h2 p 翻頁,分頁,無重新整理翻頁,...