✔ Probleme mit MouseOver

[ATLaptop]

Hallo, folgendes: Ich wollte ein Nav-Menü Tabellenlos gestalten und habe das folgendermaßen versucht:

head:
<style type="text/css">     
body { background-image: url(images/home/back.gif);
          background-repeat: repeat;
          background-color: white }
div  { position : absolute }     
	 #bild1	{ top:  20px; left: 12px}
	 #bild2 	{ top: 150px; left: 0px}
	 #bild3	{ top: 170px; left: 0px}
       	 #bild4 	{ top: 190px; left: 0px}
       	 #bild5       { top: 210px; left: 0px}
</style>

body:
<div id="bild1">  
<a href="seite1.html" target="mainFrame"><img src="http://www.tutorials.de/forum/images/home/buttons/bild1.gif" onMouseOver="src=images/home/buttons/bild1_t.gif" onMouseOut="src=images/home/buttons/bild1.gif" border="0" alt="Basteln" width="140" height="20"></a> 
</div>

Was allerdings nicht passiert ist: Das MouseOver Bild wird nicht angezeigt.
Kann mir da jeder weiterhelfen?

Danke
ATLaptop

 

[redlama]

MouseOver gehört nicht zu CSS. Das ist eher ein JavaScript Problem.
Wir könnten Dir höchstens sagen, wie Du den gleichen Effekt auch ohne JavaScript, dafür mit CSS erhalten kannst!
Das wäre dann so:
Der Css Code

.button
{
  display: block;
  width: 140px;
  height: 20px;
  background: url(images/home/buttons/bild1.gif);
}
.button:hover
{
  background-image: url(images/home/buttons/bild1_t.gif);
}

Und der HTML Code

<a href="seite1.html" target="mainFrame" class="button"></a>

redlama

 

[ATLaptop]

... stimmt, daran hatt ich nicht gedacht - meine letzten Bemühungen diesbezüglich liegen schon weiter zurück.

Nur wie kann ich das dann absolut positionieren? Genau so?

 

[redlama]

Wenn ich das richtig sehe, dann wird doch <div id="bild1"> positioniert.
Der Link, der in dem Div liegt, müsste also da sein, wo er hin soll.
Ach ja, Du müsstest für jedes Bild eine Extra CSS Klasse definieren.
Als mach mal aus .button und .button:hover jeweils .button1 bzw. .button:hover.
Und dann machst Du für alle weiteren Bilder Klaasen, die Du dann .button2, .button3, ... nennest.
Dann musst Du natürlich auch im Link jeweils die entsprechende Klasse aufrufen.

redlama

 

[ATLaptop]

Danke!
Sollte so funktionieren!