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

OnMouseOver Festes Bild bei Seitenauswahl

S

SimoNxD

Mitglied
Hallo Leute,

Wie immer melde ich mich wegen einem Problem :)
In meinem Menü mit Buttons habe ich 2 Verschiedene Buttons á Menüpunkt.

Ein PNG und ein Gif

HTML: 
#start1 {background-image:url(../images/Buttons/start.png); background-repeat: no-repeat; display: block; height: 37px; width: 158px;}
#start1:hover {background-image:url(../images/Buttons/start1.gif);}

so :)

Wie ist es möglich das das Hover Bild dauerhaft Im Menüpunkt angezeigt wird wenn man auf der Entsprechenden Seite ist?

Beispiel

OnMouseOut = Startseite
OnMouseOver = Startseite :D

(Man beachte bei MouseOver kommt das '':D'' dazu)

Wenn ich nun die Startseite auswähle, wie kann ich diesen Smilie (der is nur ein beispiel!) Solange anzeigen lassen bis man zB zur Team seite geht?
 
Schreib im CSS

Code: 
#start1:hover, .aktiv {background-image:url(../images/Buttons/start1.gif);}

und setze im HTML-Code auf der jeweils aktuellen Seite die Klasse "aktiv" ein.
 
HTML: 
<body class="aktiv">

So ;x?!
Wenn ja funktioniert es nicht ;x
Da kommen im Hintergrund das bild 200000 mal ^^
 
Zuletzt bearbeitet:
oder wie sonst gebe ich der zB index.php einen bestimmt wert bzw eine bestimmte klasse?

Kann mir niemand helfen ;x?
 
leider das selbe problem.

Die CSS
Code: 
#start1 {background-image:url(../images/Buttons/start.png); background-repeat: no-repeat; display: block; height: 37px; width: 158px;}
#start1:hover, .aktiv {background-image:url(../images/Buttons/start1.gif);}

HTML Menü
Code: 
<tr>	  <td><a href="index2.php" id="start1"></a></td>
	</tr>
<body class="aktiv">

Kommt folgendes raus

html.JPG

der button wo der Rote pfeil drauf zeigt (Der mit flammen) sollte bei Ausgewählten Menüpunkt ''Startseite'' (Blauerpfeil) auch mit Flammen angezeigt werden, und nicht oben rechts in die ecke :O
 
Das

HTML: 
<tr>	  <td><a href="index2.php" id="start1"></a></td> 	</tr> <body class="aktiv">

ist völlig falsch.

Das

HTML: 
<tr>	  <td><a href="index2.php" id="start1" class="aktiv"></a></td>
	</tr>

wäre richtig.

Besser wäre jedoch, wenn Du das Menü auch als solches auszeichnest. Aktuell scheinst Du ja eine Tabelle dafür zu missbrauchen. Menüs baut man aber als Liste auf. Also:

HTML: 
<ul>[..]<li><a href="index2.php" id="start1" class="aktiv"></a></li>[..]</ul>
 
HTML: 
<ul>	<li><a href="index2.php" id="start1" class="aktiv"></a></li>	<li><a href="http://mt2tanzteufel.vision-board.de" id="forum1" target="_blank"></a></li>	<li><a href="register.php" id="regist1"></a></li>	<li><a href="event.php" id="event1"></a></li></ul>

Nun wird mein Menü Komplett verzogen angezeigt...
Mit Punkten Vor jedem Button...
Und das wenn ich auf Startseite bin, wird der Hover Button von Startseite immer noch nicht angezeigt...
Trotz class="aktiv"...
Wo is das problem -.-*!?
 
Natürlich musst Du die Liste auch so stylen wie Du es willst. Wenn Du die Listenpunkte loswerden willst, ergänze:

Code: 
ul { list-style: none; }

Abstände etc. dann auch noch beachten und ggfs. anpassen. Dank der Liste hast Du darüber aber die volle Kontrolle, anders als bei einer Tabelle.
 
Ich würde mal raten und sagen, dass hier

Code: 
#start1 {background-image:url(../images/Buttons/start.png); background-repeat: no-repeat; display: block; height: 37px; width: 158px;}
#start1:hover, .aktiv {background-image:url(../images/Buttons/start1.gif);}

die Eigenschaften von .aktiv durch #start1 überschrieben werden. Da gibt es 2 Lösungsmöglichkeiten:

a)
Code: 
#start1:hover, .aktiv {background-image:url(../images/Buttons/start1.gif) !important;}

b)
Verzichte auf IDs.
 
Du musst dich einloggen oder registrieren, um hier zu antworten.

Neueste Beiträge

Zurück
Oben