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

Mouseover bei Bildern????

Status
Für weitere Antworten geschlossen.
A

afraundtim

Neues Mitglied
Hallo zusammen!

Ich habe dieses Script im WWW gefunden...
<style>
a { display:block;
background-image:url(button.gif);
width:120px; height:30px }
a:hover { background-image:url(button_on.gif); }
</style>
...Das Problem:
Was soll ich machen wenn ich mehrere Grafiken habe, da nicht bei jeder das selbe Bild angezeigt werden soll???

MfG
Alex
 
Lösung

Hab die Lösung selber schon gefunden... dieses Script.


<html>
<head>
<title>Home</title>

<style type="text/css">
.mouseover1 { background:url(icons/home.png); width:256px;height:256px; }
.mouseover1 a:hover { background:url(icons/home_mouseover.png); }
</style>
<style type="text/css">
.mouseover2 { background:url(icons/chat.png); width:256px;height:256px; }
.mouseover2 a:hover { background:url(icons/chat_mouseover.png); }
</style>
<style type="text/css">
.mouseover3 { background:url(icons/download.png);; width:256px;height:256px; }
.mouseover3 a:hover { background:url(icons/download_mouseover.png); }
</style>

</head>
<body>
<div class="mouseover1"><a class="mouseover1" href="index.php" title="Home"></a></div>
<div class="mouseover2"><a class="mouseover2" href="chat.php" title="Chat"></a></div>
<div class="mouseover3"><a class="mouseover3" href="index.php" title="Download"></a></div>
</body>
</html>

Neues Problem...
die Symbole sind untereinander angeordnet, obwohl nirgendwo <br> steht.
Wie löse ich das Problem?
 
Entschuldigung, aber das versteh ich nicht so-bin nicht der css-star kannst du mir bitte zeigen was su meinst?
-danke
 
Oder meinst du so...

<html>
<head>
<title>Home</title>

<style type="text/css">
.mouseover1 { background:url(icons/home.png); width:256px;height:256px; }
.mouseover1 a:hover { background:url(icons/home_mouseover.png); }
</style>
<style type="text/css">
.mouseover2 { background:url(icons/chat.png); width:256px;height:256px; }
.mouseover2 a:hover { background:url(icons/chat_mouseover.png); }
</style>
<style type="text/css">
.mouseover3 { background:url(icons/download.png); width:256px;height:256px; }
.mouseover3 a:hover { background:url(icons/download_mouseover.png); }
</style>

</head>
<body>
<div style="float: left;>
<div class="mouseover1"><a class="mouseover1" href="index.php" title="Home"></a></div>
<div class="mouseover2"><a class="mouseover2" href="chat.php" title="Chat"></a></div>
<div class="mouseover3"><a class="mouseover3" href="index.php" title="Download"></a></div>
</div>
</body>
</html>


..aber dann werden die symbole so angeordnet...

12
3
---------problemo-----------------
 
Zuletzt bearbeitet:
Status
Für weitere Antworten geschlossen.

Neueste Beiträge

Zurück
Oben