Contoh -contoh dalam artikel ini berbagi kode implementasi spesifik efek tab JS untuk referensi Anda. Konten spesifiknya adalah sebagai berikut
Gambar reproduksi:
Kode Implementasi:
<html> <head> <meta http-equiv = "content-type" content = "text/html; charset = gb2312"/> <itement> unt judul dokumen </iteme> <style type = "text/css"> body {font-size: 12px; font-weight: tebal; Teks-Align: tengah; latar belakang-warna:#990000;} .sec1 {color:#990000; Teks-Align: tengah; latar belakang-warna: #fffff;} div {line-height: 22px;} </tyle> <script language = "javascript"> function $ (id) {return document.getElementById (id); } function xxk (num, id, ii, iii) {// alert (ii); var dq; untuk (var i = 1; i <= num; i ++) {if (i == id) {dq = $ (ii+i) .className = 'sec'; // Opsi saat ini $ (iii+i) .style.display = "block"; } else {dq = $ (ii+i) .className = 'sec1'; $ (iii+i) .style.display = "none"; }}}} </script> </head> <body> <Table cellpadding = "4" cellPacing = "1" bordercolor = "#ffffff" bgcolor = "#990000"> <td id = "t1" onMouseOver = "xxk (5,1, 't', 'tt') bgcolor = "#ffffff" id = "t2" onmouseover = "xxk (5,2, 't', 'tt')"> tab2 </td> <td bgcolor = "#fffff" id = "t3" onmouseover = "xxk (5,3, 't', 'tt')) bgcolor="#FFFFFF" id="t4" onmouseover="xxk(5,4,'t','tt')">Tab 4</td> <td bgcolor="#FFFFFF" id="t5" onmouseover="xxk(5,5,'t','tt')">Tab 5</td> </tr> <tt> <td colspan = "5" bgcolor = "#ffffff"> <div id = "tt1"> tab yang melayani pada bulan Januari </div> <div id = "tt2" style = "display: none;"> tab sedang bekerja di bulan Februari </div> <div id = "tt3" style = "Display: none no;"> Tabs di Maret di Maret = "TT3" tt3 "Tampilkan: Tidak Ada;"> Tabs di Maret di Maret = "TT3" TT3 "Tampilkan: Tidak Ada;"> Tabs di Maret di Maret = "TT3" TTA "TPLET =" style = "display: none;"> tab sedang bekerja pada bulan April </div> <div id = "tt5" style = "display: none;"> tab sedang bekerja di bulan Mei </div> </td> </tr> </bojle> <br /> <Table cellpadding = "4" cellpacing = "1" "#" "#" "#" "#" "#" "#" "#" id = "ts1" ontClick = "xxk (4,1, 'ts', 'tts')"> tab 1 </td> <td bgcolor = "#ffffff" id = "ts2" onclick = "xxk (4,2, 'ts', 'ts')"> Tab 2 </td "td = Td = Ts ',' TS ')"> Tab 2 </td "<" onclick="xxk(4,3,'ts','ts')">Tab 3</td> <td bgcolor="#FFFFFF" id="ts4" onclick="xxk(4,4,'ts','ts')">Tab 4</td> </tr> <tr> <td colspan="4" bgcolor="#FFFFFF"> <Div id = "tts1"> tab sedang bekerja pada bulan Januari </div> <div id = "tts2" style = "display: none;"> tab sedang bekerja pada bulan Februari </div> <div id = "tts3" style = "display: none;"> Tab </div> <div id = "tts4" style = "none; </body> </html>Di atas adalah semua tentang artikel ini, saya harap ini akan membantu untuk pembelajaran semua orang.