• Jetzt anmelden. Es dauert nur 2 Minuten und ist kostenlos!

Tab-Reiter ohne JS

T

TZP

Neues Mitglied
N´abend.
Ist es möglich eine Art Reiter ohne JavaScript in HTML zu erstellen? Ich stelle mir das in etwa so vor: Meine Seite zeigt ein paar Texte und Bilder an...0815-Zeug, nix besonderes.
Unten rechts soll dann ein TabReiter rein, wo ich zwischen verschiedenen Texten "switchen" kann. Ich hab das hier bereits gefunden und damit rumprobiert

Listamatic: Eric Meyer's tabbed navbar

Der Nachteil daran ist, dass er -dank des href- immer ne neue Seite aufmacht und mir dann den Inhalt anzeigt. Der Inhalt soll aber gleich zu sehen sein, ohne eine neue Seite aufzumachen. Geht so was überhaupt?
In Flash hätte man 2 Movies/Textfelder genommen und einfach die z-Achse vertauscht. ^^

-bedank-
TZP
 
Ne, leider nich. Ich dachte eher an so was wie beim Browser. Da haste oben deine Reiter und wenn du einen auswählst, kommt sofort auf dem Bildschirm die Änderung. So was halt auch in HTML so in der Mitte einer Seite.
 
Hallo.

Du kannst so etwas mit PHP realisieren falls der Webspace über PHP verfügt.
Such einmal nach php include.

Gruss
Elroy
 
So, fast geschafft. Ich hab jetzt was am Start aber das geht nur über JavaScript. Gibt es n Weg das ohne JS zu schaffen oder komm ich da nich dran vorbei? Ich würde es gerne nur mit CSS machen aber ich glaube, das wird nix. ^^

HTML: 
<html>
<head>
<title>Test z-index</title>
<script language="JavaScript">
function changeZunder() {
layer1.style.zIndex = 1;
layer2.style.zIndex = 2;
}

function changeZover() {
layer1.style.zIndex = 2;
layer2.style.zIndex = 1;
}
</script>
</head>
<body>
<div id="layer1" style="position: absolute; left: 50px; top: 50px; padding: 50 50 50 50; width: 300px; font-size: 14pt; color: #0000FF; background-color: #00FF00; z-index: 1">This is blue text with a green background.</div>
<div id="layer2" style="position: absolute; left: 150px; top: 150px; padding: 50 50 50 50; width: 300px; font-size: 14pt; color: #FF0000; background-color: #000000; z-index: 1">This is red text with a black background.</div>
<div id="layer3" style="position: absolute; left: 150px; top: 300px; padding: 50 50 50 50; width: 100px; z-index: 1">
<button onClick="changeZunder()">changeZunder()</button> <button onClick="changeZover()">changeZover()</button>
</div>
</body>
</html>
 
Hallo.

ich habe dir ja schon weiter oben geschrieben wie du das ohne JS machen kannst.
Mit CSS alleine geht so etwas nicht, dafür ist CSS nicht gedacht.

Gruss
Elroy
 
Du musst dich einloggen oder registrieren, um hier zu antworten.

Neueste Beiträge

Zurück
Oben