レイアを使ったタブインデックス
あああああああああああああああああああああああああああああああああああああああ
いいいいいいいいいいいいいいいいいいいいいいいいいいいいいいいいいいいいいいい
ううううううううううううううううううううううううううううううううううううううう
えええええええええええええええええええええええええええええええええええええええ
おおおおおおおおおおおおおおおおおおおおおおおおおおおおおおおおおおおおおおお
|
かかかかかかかかかかかかかかかかかかかかかかかかかかかかかかかかかかかかかかか
ききききききききききききききききききききききききききききききききききききききき
くくくくくくくくくくくくくくくくくくくくくくくくくくくくくくくくくくくくくくく
けけけけけけけけけけけけけけけけけけけけけけけけけけけけけけけけけけけけけけけ
こここここここここここここここここここここここここここここここここここここここ
さささささささささささささささささささささささささささささささささささささささ
ししししししししししししししししししししししししししししししししししししししし
すすすすすすすすすすすすすすすすすすすすすすすすすすすすすすすすすすすすすすす
せせせせせせせせせせせせせせせせせせせせせせせせせせせせせせせせせせせせせせせ
そそそそそそそそそそそそそそそそそそそそそそそそそそそそそそそそそそそそそそそ
|
たたたたたたたたたたたたたたたたたたたたたたたたたたたたたたたたたたたたたたた
ちちちちちちちちちちちちちちちちちちちちちちちちちちちちちちちちちちちちちちち
つつつつつつつつつつつつつつつつつつつつつつつつつつつつつつつつつつつつつつつ
ててててててててててててててててててててててててててててててててててててててて
ととととととととととととととととととととととととととととととととととととととと
ななななななななななななななななななななななななななななななななななななななな
ににににににににににににににににににににににににににににににににににににににに
ぬぬぬぬぬぬぬぬぬぬぬぬぬぬぬぬぬぬぬぬぬぬぬぬぬぬぬぬぬぬぬぬぬぬぬぬぬぬぬ
ねねねねねねねねねねねねねねねねねねねねねねねねねねねねねねねねねねねねねねね
ののののののののののののののののののののののののののののののののののののののの
ははははははははははははははははははははははははははははははははははははははは
ひひひひひひひひひひひひひひひひひひひひひひひひひひひひひひひひひひひひひひひ
ふふふふふふふふふふふふふふふふふふふふふふふふふふふふふふふふふふふふふふふ
へへへへへへへへへへへへへへへへへへへへへへへへへへへへへへへへへへへへへへへ
ほほほほほほほほほほほほほほほほほほほほほほほほほほほほほほほほほほほほほほほ
|
ままままままままままままままままままままままままままままままままままままままま
みみみみみみみみみみみみみみみみみみみみみみみみみみみみみみみみみみみみみみみ
むむむむむむむむむむむむむむむむむむむむむむむむむむむむむむむむむむむむむむむ
めめめめめめめめめめめめめめめめめめめめめめめめめめめめめめめめめめめめめめめ
ももももももももももももももももももももももももももももももももももももももも
|
ややややややややややややややややややややややややややややややややややややややや
ゆゆゆゆゆゆゆゆゆゆゆゆゆゆゆゆゆゆゆゆゆゆゆゆゆゆゆゆゆゆゆゆゆゆゆゆゆゆゆ
よよよよよよよよよよよよよよよよよよよよよよよよよよよよよよよよよよよよよよよ
|
ららららららららららららららららららららららららららららららららららららららら
りりりりりりりりりりりりりりりりりりりりりりりりりりりりりりりりりりりりりりり
るるるるるるるるるるるるるるるるるるるるるるるるるるるるるるるるるるるるるるる
れれれれれれれれれれれれれれれれれれれれれれれれれれれれれれれれれれれれれれれ
ろろろろろろろろろろろろろろろろろろろろろろろろろろろろろろろろろろろろろろろ
わわわわわわわわわわわわわわわわわわわわわわわわわわわわわわわわわわわわわわわ
ををををををををををををををををををををををををををををををををををををををを
んんんんんんんんんんんんんんんんんんんんんんんんんんんんんんんんんんんんんんん
|
■ このスクリプトのソース（あくまでも参考ソースです、それぞれの使用法に合わせて調整して下さい）
※ Mac + IE では、タブと本文の間に多少の間隔が空いてしまうそうです。
対応例はココのソースを参考にして下さい。
<style>
.tab { position:absolute; visibility:hidden; }
</style>
<script>
lay = nn = ie = gc = 0;
if (document.layers) nn = 1;
else if (document.all) ie = 1;
else if (document.getElementById) gc = 1;
function active(p) {
for (i = 1; i <= lay; i ++) {
if (nn) obj = document.layers["lay" + i];
if (ie) obj = document.all("lay" + i).style;
if (gc) obj = document.getElementById("lay" + i).style;
with (obj) { zIndex = 0; visibility = "hidden"; }
}
if (nn) obj = document.layers["lay" + p];
if (ie) obj = document.all("lay" + p).style;
if (gc) obj = document.getElementById("lay" + p).style;
with (obj) { zIndex = 1; visibility = "visible"; }
}
function init () {
if (nn) list = document.layers;
if (ie) list = document.all.tags("div");
if (gc) list = document.getElementsByTagName("div");
for (i = 0; i < list.length; i ++)
if (list[i].id.match(/lay/)) lay ++;
active(1);
}
onload = init;
/*
□ 各レイア<div>の名前(id)は "lay1","lay2"...の形式にして class=tab を指定する
□ 関数の呼び出しは、lay1なら active(1)、lay2なら activ(2)...とする
*/
</script>
<p>
<table border=0 cellspacing=0 cellpadding=10 width=660>
<tr>
<th width=110 bgcolor=lavender><a href="" onClick="active(1); return false">はじめに</a></th>
<th width=110 bgcolor=palegreen><a href="" onClick="active(2); return false">つぎに</a></th>
<th width=110 bgcolor=mistyrose><a href="" onClick="active(3); return false">そのつぎに</a></th>
<th width=110 bgcolor=plum><a href="" onClick="active(4); return false">さらに</a></th>
<th width=110 bgcolor=paleturquoise><a href="" onClick="active(5); return false">ちなみに</a></th>
<th width=110 bgcolor=navajowhite><a href="" onClick="active(6); return false">さいごに</a></th>
</tr>
</table>
<div id=lay1 class=tab>
<table border=0 cellspacing=0 cellpadding=10 width=660 bgcolor=lavender><td>
ああああああああああああああああああああああああああ
</td></table></div>
<div id=lay2 class=tab>
<table border=0 cellspacing=0 cellpadding=10 width=660 bgcolor=palegreen><td>
いいいいいいいいいいいいいいいいいいいいいいいいいい
</td></table></div>
<div id=lay3 class=tab>
<table border=0 cellspacing=0 cellpadding=10 width=660 bgcolor=mistyrose><td>
うううううううううううううううううううううううううう
</td></table></div>
<div id=lay4 class=tab>
<table border=0 cellspacing=0 cellpadding=10 width=660 bgcolor=plum><td>
ええええええええええええええええええええええええええ
</td></table></div>
<div id=lay5 class=tab>
<table border=0 cellspacing=0 cellpadding=10 width=660 bgcolor=paleturquoise><td>
おおおおおおおおおおおおおおおおおおおおおおおおおお
</td></table></div>
<div id=lay6 class=tab>
<table border=0 cellspacing=0 cellpadding=10 width=660 bgcolor=navajowhite><td>
んんんんんんんんんんんんんんんんんんんんんんんんんん
</td></table></div>
|
