<style type="text/css">
<!--
p.bold { font:bold 12px Verdana; }
p.white { color:white; }
.blue { border:1px solid #7B7BFF; }
.red { border:1px solid #FF63FF; }
.green { border:1px solid #008000; }
-->
</style>

<script type="text/javascript">
<!--

var ie = document.all?1:0; // Browser-Checker
var w3c = document.getElementById?1:0;
var ns4 = document.layers?1:0;

var tab = "tab1";
var card = "card1";
var diff = 0;


function intro() { // Registerkartei zentrieren

var halfC = ((w3c)?document.getElementById(card).offsetWidth:document[card].clip.width)/2;
var cardLeft = ((ie)?document.body.offsetWidth:window.innerWidth)/2 - halfC;

toggle(card, 1, 6);

for(var i = 1; i <= 6; i++) {

toggle('tab' + i, 1);

if(ie||w3c) {
document.getElementById('tab' + i).style.left = cardLeft + diff + "px";
document.getElementById('card' + i).style.left = cardLeft + "px";
diff += document.getElementById(tab).offsetWidth;
}

else if(ns4) {
document['tab' + i].left = cardLeft + diff;
document['card' + i].left = cardLeft;
diff += document[tab].clip.width;
}
}
}


function toggle(element, vis, index) { // Sichtbarkeit und z-index aendern

var what = new Array("hidden", "visible");

if(ie||w3c) {
document.getElementById(element).style.visibility = what[vis];
index?document.getElementById(element).style.zIndex = index:'';
}

else if(ns4) {
document[element].visibility = what[vis];
index?document[element].zIndex = index:'';
}
}


function toTop(ntab, ncard) { // Angeklicktes Registerblatt in den Vordergrund bringen

if(ncard != card && ntab != tab) {

toggle(card, 0, 1);
toggle(tab, 1, 1);
toggle(ncard, 1, 8);
toggle(ntab, 1, 9);

if(ie||w3c) {
document.getElementById(ntab).style.top = 50 + "px";
document.getElementById(tab).style.top = 54 + "px";
}

else if(ns4) {
document[ntab].top = 50;
document[tab].top = 54;
}
}
tab = ntab;
card = ncard;
}
//-->
</script>

onload="intro()"

<div id="tab1" style="position:absolute; left:130px; top:50px; width:73px; z-index:7; visibility:hidden;">
<a href="#" onclick="toTop('tab1','card1');return false" onfocus="if(document.all) this.blur()"><img src="pics/tab1.gif" width="73" height="24" border="0" alt=""></a>
</div>

<div id="tab2" style="position:absolute; left:203px; top:54px; z-index:5; visibility:hidden;">
<a href="#" onclick="toTop('tab2','card2');return false" onfocus="if(document.all) this.blur()"><img src="pics/tab2.gif" width="73" height="24" border="0" alt=""></a>
</div>

<div id="tab3" style="position:absolute; left:276px; top:54px; z-index:4; visibility:hidden;">
<a href="#" onclick="toTop('tab3','card3');return false" onfocus="if(document.all) this.blur()"><img src="pics/tab3.gif" width="73" height="24" border="0" alt=""></a>
</div>

<div id="tab4" style="position:absolute; left:349px; top:54px; z-index:3; visibility:hidden;">
<a href="#" onclick="toTop('tab4','card4');return false" onfocus="if(document.all) this.blur()"><img src="pics/tab4.gif" width="73" height="24" border="0" alt=""></a>
</div>

<div id="tab5" style="position:absolute; left:422px; top:54px; z-index:2; visibility:hidden;">
<a href="#" onclick="toTop('tab5','card5');return false" onfocus="if(document.all) this.blur()"><img src="pics/tab5.gif" width="73" height="24" border="0" alt=""></a>
</div>

<div id="tab6" style="position:absolute; left:495px; top:54px; z-index:1; visibility:hidden;">
<a href="#" onclick="toTop('tab6','card6');return false" onfocus="if(document.all) this.blur()"><img src="pics/tab6.gif" width="73" height="24" border="0" alt=""></a>
</div>


<div id="card1" style="position:absolute; left:130px; top:72px; z-index:6; visibility:hidden;">
<table class="blue" border="1" cellpadding="8" cellspacing="0" width="440"><tr>
<td bgcolor="#FF6363" height="290" valign="top">
<br>
<p class="bold">
Erste Seite</p>
<p class="white">Mit dieser von Tabellenkalkulationen her bekannten Registerdarstellung lassen sich grosse Mengen an Informationen auf kleinstem Raum präsentieren.
</p>
<p class="white">
Die Registerkartei ist zudem beliebig anpassungsfähig, cross-browser-kompatibel, intuitiv bedienbar und elegant.</p>
</td></tr>
</table>
</div>

<div id="card2" style="position:absolute; left:130px; top:72px; z-index:5; visibility:hidden;">
<table class="red" border="1" cellpadding="8" cellspacing="0" width="440"><tr>
<td bgcolor="#3A3AFF" height="290" valign="top">
<br>
<p class="bold">
Zweite Seite</p>
Tabellen
</td></tr>
</table>
</div>

<div id="card3" style="position:absolute; left:130px; top:72px; z-index:4; visibility:hidden;">
<table class="blue" border="1" cellpadding="8" cellspacing="0" width="440"><tr>
<td bgcolor="#10C59C" height="290" valign="top">
<br>
<p class="bold">
Dritte Seite</p>
<img src="pics/dax.gif" width="163" height="95" align="top" alt="">
Grafiken
</td></tr>
</table>
</div>

<div id="card4" style="position:absolute; left:130px; top:72px; z-index:3; visibility:hidden;">
<table class="blue" border="1" cellpadding="8" cellspacing="0" width="440"><tr>
<td bgcolor="#FFA07A" height="290" valign="top">
<br>
<p class="bold">
Vierte Seite</p>
<a href="reg-card.txt">Links</a>
</td></tr>
</table>
</div>

<div id="card5" style="position:absolute; left:130px; top:72px; z-index:2; visibility:hidden;">
<table class="blue" border="1" cellpadding="8" cellspacing="0" width="440"><tr>
<td bgcolor="#339999" height="290" valign="top">
<br>
<p class="bold">
Fünfte Seite</p>
Formulare

<form action="">
<br>
<input type="text" size="25">
</form>

</td></tr>
</table>
</div>

<div id="card6" style="position:absolute; left:130px; top:72px; z-index:1; visibility:hidden;">
<table class="green" border="1" cellpadding="8" cellspacing="0" width="440"><tr>
<td bgcolor="#B0C4DE" height="290" valign="top">
<br>
<p class="bold">
Sechste Seite </p>
Multimedia
</td></tr>
</table>
</div>

??

Kopieren Sie bitte den Code