Navigation beim drüberfahren einfärben ?!

Noxxx · Beitrag von **Noxxx** » 14.02.2008 13:38

Hi ich habe mir ein Navimenüerstellt.

<div id="navinner">
			<a tabindex="1" title="News" href="index.php?content=Ind">				News</a>
			<a tabindex="2" title="Impressum" href="index.php?content=impressum">	Impressum</a>
			<a tabindex="3" title="Portfolio" href="index.php?content=portfolio">	Portfolio</a>
			<a tabindex="4" title="Leistung" href="index.php?content=leistung">		Leistung</a>
			<a tabindex="5" title="Preise" href="index.php?content=preise">			Preise</a>
			<a tabindex="8" title="Kontakt" href="index.php?content=kontakt">		Kontakt</a></div>

so und dann habe ich in meiner css datei folgendes Hinterlegt

Code: Alles auswählen

.navpressed {
	background: #F1EFEC;
	text-decoration: none;
	color: #817769;
	border: 1px dotted #FFFFFF;
}

und nun möchte ich das wenn man mit der maus drüber fährt sich der "Balken" in der css farbe färbt ähnlich dem wenn man mit der maus über einen link "hovert".....

gibt es dann nen html befehl ? oder muss ich das über java machen ?! wenn ja wie ?!

djchrisnet · Beitrag von **djchrisnet** » 14.02.2008 13:51

probier mal

Code: Alles auswählen

.navinner a:hover {
color: #FF0000;
}

Beitrag von **Jan500** » 14.02.2008 13:55

ich würde es eher so machen

<html>
<head>
<style type="text/css">

#navinner:hover {
background: #F1EFEC;
text-decoration: none;
color: #817769;
border: 1px dotted #FFFFFF;
}
</style>
</head>
<body>
<div id="navinner">
<a tabindex="1" title="News" href="index.php?content=Ind"> News</a>
<a tabindex="2" title="Impressum" href="index.php?content=impressum"> Impressum</a>
<a tabindex="3" title="Portfolio" href="index.php?content=portfolio"> Portfolio</a>
<a tabindex="4" title="Leistung" href="index.php?content=leistung"> Leistung</a>
<a tabindex="5" title="Preise" href="index.php?content=preise"> Preise</a>
<a tabindex="8" title="Kontakt" href="index.php?content=kontakt"> Kontakt</a></div>
</body>
</html>

Jan

Noxxx · Beitrag von **Noxxx** » 14.02.2008 15:34

danke

aber gibt es auch ne möglichkeit das in der css zu lassen ?

hab es gerade mal getesten jetzt hovert es zwar aber das ganze feld ??! und nicht die einzelnen abschnitte ?!!

alternativ habe ich versucht jetzt in dem link das

class="news"

reinzuschreiben und dann den style abgeändert in

Code: Alles auswählen

#news:hover { 
background: #F1EFEC; 
text-decoration: none; 
color: #817769; 
border: 1px dotted #FFFFFF; 
}

aber das geht nicht

djchrisnet · Beitrag von **djchrisnet** » 14.02.2008 15:55

Code: Alles auswählen

#news a:hover {
background: #F1EFEC;
text-decoration: none;
color: #817769;
border: 1px dotted #FFFFFF;
}

Noxxx · Beitrag von **Noxxx** » 14.02.2008 16:36

geht leider auch nicht.....

Beitrag von **Boecki91** » 14.02.2008 17:11

Beispiellink?

Noxxx · Beitrag von **Noxxx** » 14.02.2008 17:28

http://www.hate-you.ch/ad/

in txt

http://www.hate-you.ch/ad/index.txt

Beitrag von **Boecki91** » 14.02.2008 17:34

Code: Alles auswählen

#navinner a:hover {
background: #000000;
}

Macht das was ich von dir verstanden habe.

Edit:

Gerade erst gemerkt: Du solltest für die erfolgreiche Webseite umbedingt CSS Lernen.

Ein Webdesigners der kein CSS kann...

Noxxx · Beitrag von **Noxxx** » 15.02.2008 07:14

Code: Alles auswählen

#navinner a:hover {
	/*background: #F2F0E8;
	text-decoration: none;
	color: #706C67; */
}

so damit geht es wenn man das in die css schreibt

ausserdem ist die seite css....?! natürlich nicht perfekt,... das ist hobby!