MyBB.de Forum

Normale Version: CSS | Mousover Button
Du siehst gerade eine vereinfachte Darstellung unserer Inhalte. Normale Ansicht mit richtiger Formatierung.
Seiten: 1 2
Moin.

Ich habe folgendes Problem.
Ich habe 2 Buttons erstellt, mit jeweils einer Font drauf.
Nun möchte ich das ganze via Css mit einem Mouseover machen.

Wie mache ich das nun?

Im moment habe ich das so.
Nur wie kann ich dann den Button verlinken.

style>
a { display:block;
background-image:url(URL);
width:300px; height:75px }
a:hover { background-image:url(URL); }
</style>

youfree

ich weiß es nicht genau aber ich glaube so geht das ich gebe dir aber keine 100%ige Garantie das es funkioniert:

Ändere deinen Code wie folgt um:

PHP-Code:
<style>
ul#navigation {
display:block;
background-image:url(URL);
width:300pxheight:75px }
a:hover background-image:url(URL); }
</
style

Und als Links so:

PHP-Code:
<ul id="navigation">
  <
li><a href="link1.htm">Dein Link</a></li>
</
ul

mfg,

youfree
http://www.developers-guide.net/forums/2...+nachladen
Da ist das ganze sehr gut erklärt und gelöst.
Ich habe jetzt noch eine Möglichkeit mit Java gefunden.
Wenn ich aber jetzt 2 mal den Code hintereinander in der Html Datei benutze, klappt der Mouseover-Effekt nicht mehr.
Hier mal der Code:

Zitat:<a href="index.html"
onMouseOver="document.Bild.src='BILD 1';"
onMouseOut="document.Bild.src='BILD "';">

<img src="BILD, DAS ALS ERSTES ANGEZEIGT WERDEN SOLL"
name="Bild"
width=300 height=75
alt="test"
border=0>
</a></div>
Funktioniert gar keiner mehr oder nur einer nicht? Ein Link zum Ausprobieren wäre ganz nett.
Wenn ich einmal den Code in der .html Datei drin habe, dann klappt das ganze. Wenn ich aber noch ein anderen Button mit diesem Code einbaue, klappt das ganze nicht mehr. Die beiden Buttons werden zwar dargestellt, doch wenn ich mit der Maus über einen der beiden Buttons gehe, passiert nichts.
Ich wollte nochmal nachfragen, ob jemand eine Idee hat.
Oder mir ein Code gibt, mit dem ich das auch machen kann.
Entferne mal die beiden Semikolon (Strichpunkte) aus Deinem letztgenannten Code. Dann sollte es funktionieren.
Es kommt immernoch kein Mouseover Effekt.
Ooops, übersehen ... in Deinem o.a. Code ist in der 3. Zeile (vor dem Semikolon) ein Anführungszeichen zuviel.

Richtiger Code:

Code:
<a href="index.html"
onMouseOver="document.Bild.src='BILD_2'"
onMouseOut="document.Bild.src='BILD_1'">

<img src="BILD_1"
name="Bild"
width="300"
height="75"
alt="test"
border="0" />

</a>
Seiten: 1 2