nicht angemeldet
Hi alle.
Ich such nun seit einigen Stunden und hab so einiges entdeckt, Quelltext-Fragmente in JS, PHP und CSS.
Doch so richtig gefällt mir/funktioniert nix davon.
Folgendes Problem:
3 Frames.
---------------------
Frame1
---------------------
Frame2 - Frame3
-
-
-
-
---------------------
Hier die Testseite: www.ofze.de/secret
Frame1 enthält nur das Titelbild, im Frame2 ist das Menü enthalten (ca. 9 Buttons untereinander) und im Frame3 soll dann jeweils nach nem Klick auf einen Menübutton die Seite erscheinen. Kein Problem bisher.
Die Buttons
Und zwar wird ein Button immer durch 3 Bilder dargestellt, eins für die normale Anzeige, das zweite für den gewöhnlichen Hovereffekt und das dritte Bild für den Aktiv (also onclick)-Status. Ich hab das jetzt rein mit CSS gemacht.
Funktioniert und sieht toll aus ABER:
***************************
Problem:
Habe ich auf einen Button geklickt(zunächst von normal-->hover, dann wird das Bild für den aktivierten Zustand angezeigt), öffnet sich die Seite im Frame3, und klick ich nun mit der Maus irgendwo hin, verschwindet das aktivierte Buttonbild und es erscheint wieder das normale. So soll es aber nicht sein, sondern das Aktiv-Bild soll die ganze Zeit angezeigt werden, bis ein anderer Button angeklickt wird.
****************************
Ausschnitt aus dem Quelltext:
Innerhalb vom <Head> werden die Anweisungen geschrieben:
<!--Button1-->
<style type="text/css">
p.home1 a { background: url(../bilder/menu_main/buttons/home_01_norm.png) no-repeat; width:175px; height:37px;}
p.home1 a:hover { background: url(../bilder/menu_main/buttons/home_01_mover.png) no-repeat; width:175px; height:37px;}
p.home1 a:active { background: url(../bilder/menu_main/buttons/home_01_act.png) no-repeat; width:175px; height:37px;}
<!--Button2-->
p.home2 a { background: url(../bilder/menu_main/buttons/news_01_norm.png) no-repeat; width:175px; height:37px;}
p.home2 a:hover { background: url(../bilder/menu_main/buttons/news_01_mover.png) no-repeat; width:175px; height:37px;}
p.home2 a:active { background: url(../bilder/menu_main/buttons/news_01_act.png) no-repeat; width:175px; height:37px;}
<!--Button3-->
p.home3 a { background: url(../bilder/menu_main/buttons/phil_01_norm.png) no-repeat; width:175px; height:37px;}
p.home3 a:hover { background: url(../bilder/menu_main/buttons/phil_01_mover.png) no-repeat; width:175px; height:37px;}
p.home3 a:active { background: url(../bilder/menu_main/buttons/phil_01_act.png) no-repeat; width:175px; height:37px;}
...und dann im <body>:
<table cellspacing="0" cellpadding="0" width="201"
background="../bilder/menu_main/menu_background.png">
<tr align="center"><td height="11"></td></tr>
<tr align="center"><td align="center" >
<p class="home1">
<a href="../pages/home.php" target="news"></a>
</p></td></tr>
<tr align="center"><td align="center">
<p class="home2">
<a href="../news/news.php" target="news"></a>
</p></td></tr>
<tr align="center"><td align="center">
<p class="home3">
<a href="../pages/philosophie.php" target="news"></a>
</p></td></tr>
Ich denke das ist soweit verständlich und einfach gehalten. Nun ändert sich aber wie bereits beschrieben der aktiv-Button zum Normal-Button, wenn man irgendwo hinklickt, es dauert leider irgendwie zu lange mit dem Bildernachladen (Sanduhr erscheint immer) und das ganze lässt sich nicht in Browsern != IE anzeigen.
Kann mir jemand mit Ratschlägen/Quelltextveränderungen helfen?
DANKE!