hoverbefehl mit PNG Grafiken

schwarza · #1 (**permalink**) 22.10.2004, 14:22

moin gemeinde,

ich versuche mich grad mal an einer navi in der form von http://www.cornishcastaways.co.uk/

übern mozilla hab ich es bisher zum laufen bekommen mit PNG24 grafiken,
der IE zeigt sie mir auch schon so an, wie ich es gern haben möchte. das problem ist der hover-befehl. beim moz ändert er die grafiken beim rübergehen, beim IE macht er es nicht (IE6). woran kann das liegen? mit normalen grafiken macht er es - gibts dort nen trick?

hier der code - zunächst für Moz, dann für den IE

#navi {
background-image: url(navi/start_klein.png);
width: 99px;
height: 60px;
visibility: visible;
position:absolute; top: 15px; left: 100px;
background-repeat: no-repeat;
background-color:transparent;
}
#navi:hover {
background-image: url(navi/start_gross.png);
width: 99px;
height: 60px;
visibility: visible;
position:absolute; top: 15px; left: 100px;
background-repeat: no-repeat;
background-color:transparent;
}

#navi {
width: 99px;
height: 60px;
position:absolute; top: 15px; left: 100px;
background-repeat: no-repeat;
filter: progid

XImageTransform.Microsoft.AlphaImageLoader (src="navi/start_klein.png",sizingMethod="crop");
}

#navi:hover {

filter: progid

XImageTransform.Microsoft.AlphaImageLoader (src="navi/start_gross.png",sizingMethod="crop");
width: 99px;
height: 60px;
position:absolute; top: 15px; left: 100px;
background-repeat: no-repeat;
}

vielleicht kann mir von euch einer helfen?
schwatta

toscho · #2 (**permalink**) 23.10.2004, 23:02

Verrate uns doch bitte mal das dazugehörige Markup, sonst kann niemand dein Problem nachvollziehen.

Gruß
Thomas

schwarza · #3 (**permalink**) 27.10.2004, 10:33

hi,

hier die dazugehörige html-datei:

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">

<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="en" lang="en">
<head>
<title></title>
<?php include "weiche.php" ?>
</head>

<body>
<div id="navi"></div><div id="navi1"></div><div id="navi2"></div>
<div id="content">[img]navi/nav1.jpg[/img]</div>
</body>
</html>

habe die testdateiene auch mal hochgeladen:
http://www.schwarza.net/navi/navi1/navigationen.php

netspy · #4 (**permalink**) 27.10.2004, 10:40

Frage: wozu brauchst du bei deinen Menüs eine Alpha-Transparenz? Ein normales GIF oder PNG würde auch reichen.

Zu deinem Problem: der IE kennt die Pseudoklasse :hover nur für das Element A. Auf andere Elemente lässt es sich nicht anwenden.

Mario

schwarza · #5 (**permalink**) 27.10.2004, 10:51

hi,

zu den alpha dachte ich mir halt wegen den hintergrund (tapete). letztendlich würde ich es schon auch mit .gif machen, da die dateigröße von png24 auch nicht unbedingt als klein einzustufen ist. mich interessierte halt jetzt nach diesem versuch, weshalb der IE das nicht macht, der mozilla aber eben schon. es geht also in diesem punkt nur noch um das verstehen. gut - also lass ich das jetzt spaßeshalber mal so, mache aber eben nen link draus....

bin ja mal gespannt

DANKE für die Info's bisher

schwarza · #6 (**permalink**) 27.10.2004, 10:59

jup es funzt so, also danke für eure antworten!

http://www.schwarza.net/navi/navi1/navigationen.php

Ähnliche Themen
Thema	Autor	Forum	Antworten	Letzter Beitrag
Zwei übereinander angeordnete Grafiken im Fließtext	Trebor	CSS	1	14.01.2011 21:24
alpha-transparente PNG im Internet Explorer	ulle	Knowledge Base	46	22.12.2010 09:33
horizontale navigation aus meheren grafiken??	celine@23	CSS	16	14.01.2007 15:03
2 Grafiken als Hintergrund ...	PiTi	CSS	3	07.09.2005 23:33
Verlinkte Vorschaubilder bei nicht geladenen Grafiken	Dieter	Barrierefreiheit	14	20.08.2005 16:02