Problem bei Hovern ( CSS oder JavaScript?)

Status
Nicht offen für weitere Antworten.

Pase89

Grünschnabel
Hi Leute, ich hätte gerne ein Bild beim Hovern, neben dem Text jedes einzelnen Buttons angezeigt. Soll heißen, wenn ich drauffahre soll das Bild rechts neben dem Text am äußeren Buttonrand erscheinen. Wäre super, wenn mir dabei jemand helfen könnte, ich kenn mich in JavaScript und CSS nicht besonders gut aus.
Danke euch schon mal im Vorraus.

Grüße Pase89

Code:
<html>
<head>
<title>
</title>

<style type="text/css">

#navi{

width:200px;
color:black;
background:transparent;
padding:1.0em;
margin:-10px;
margin-top:1em;
height:200px;
}

#navi a{
color:#BBA239;
font:bold 13px verdana, sans-serif;
margin:5px 0 5px 0;
padding:1px 3px 1px 4px;
text-decoration:none;
background:#363537;
display:block;
border-top:1px solid #99917d;
border-right:1px solid #e4d9c0;
border-bottom:1px solid #e4d9c0;
border-left:1px solid #99917d;
width:155px;
height:24px;

}

#navi a:hover{

color:#f6e4c1;
background:transparent;
border-top:1px solid #e4d9c0;
border-right:1px solid #837c6b;
border-bottom:1px solid #837c6b;
border-left:1px solid #e4d9c0;}

</style>

<body bgcolor="black">
<table border="0">

<tr>
<td>
<img src="logo_gross.gif" height="108" width="209" alt="" border="0">
</td>
</tr>
<tr>
<td>

<div id="navi">

<div id="navi">
  <ul style="list-style-type:none; margin:0; padding:0;">
    <li><a href="#" >News</a></li>
    <li><a href="#">Band</a></li>
    <li><a href="#">Gigs</a></li>
    <li><a href="#">Discographie</a></li>
    <li><a href="#">Guestbook</a></li>
    <li><a href="#">Contact</a></li>
    <li><a href="#">Impressum</a></li>
    <li><a href="#">Merch</a></li>
  </ul>
</div>
</div>
</td>
</tr>

</body>
</html>
 
Hi,

stellst du dir das eventuell so vor?

Code:
#navi a:hover{
color:#f6e4c1;
background:transparent url(pfad/zur/grafik.jpg) no-repeat right center;
border-top:1px solid #e4d9c0;
border-right:1px solid #837c6b;
border-bottom:1px solid #837c6b;
border-left:1px solid #e4d9c0;
}
 
Genau DAS wollte ich auch grade sagen Maik ^^
Aber vorsicht, dass das Bild nicht zugroß ist
Bei deinen Definitionen sollte nen 20x20 ziemlich geil rein passen ;)
 
Status
Nicht offen für weitere Antworten.
Zurück