"a:hover span" im IE
0 0 0 
Beat
0 
Gunnar Bittersmann
0 0 Gunnar Bittersmann
0 0 Gunnar Bittersmann
0 espression
0
"a:hover span" im IE
hallo leute,
ich möchte einen hover für einen a tag machen, der auch unter IE funktioniert. dazu habe ich viel recherchiert, aber irgendwie will es unter IE nicht klappen. anbei mein bisheriges ergebnis:
<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01//EN" "http://www.w3.org/TR/html4/strict.dtd">
<html>
<head>
<meta http-equiv="Content-Language" content="en">
<meta http-equiv="Content-Type" content="text/html; charset=utf-8">
<META http-equiv="Content-Style-Type" content="text/css">
<style type="text/css">
a#hoverdiv { display: block; }
a#hoverdiv:hover { background:transparent;}
a:hover hoverdiv { filter:none; }
a span.onhover { visibility:hidden; }
a:hover span.onhover { visibility:visible; display:block; }
</style>
<title>
Test Document
</title>
</head>
<body>
<div>
<a class="hoverdiv" id="hoverdiv" style="position:absolute;top:319px;left:0px;width:580px;height:107px;border-style:solid;">
<span class="onhover" id="onhover" style="position: relative;">
<span id="titletext" style="position:absolute;top:80px;left:0px;width:570px;height:17px;background-color:#cccccc;" class="img_sub_text">sdhsdh fg kjg sd fjgkj kljg f kjgjk lsdfgjkl fgjk l</span>
<span style="position:absolute;top:80px;left:522px;width:16px;height:16px;cursor:pointer;cursor:hand;" onclick="" id="gridlink"><img src="img/grid.gif" title="grid view" alt="grip view" style="border-style:none;"></span>
<span style="position:absolute;top:80px;left:538px;width:16px;height:16px;cursor:pointer;cursor:hand;" onclick=""><img src="img/l_arrow.gif" title="previous" alt="previous" style="border-style:none;"></span>
<span style="position:absolute;top:80px;left:554px;width:16px;height:16px;cursor:pointer;cursor:hand;" onclick=""><img src="img/r_arrow.gif" title="next" alt="next" style="border-style:none;"></span>
</span>
</a>
</div>
</body>
</html>
weis jemand woran es liegt?
vielen dank für alle tipps.
grüße,
tromton
-
Hi,
ich möchte einen hover für einen a tag machen, der auch unter IE funktioniert.
Das ist als Aufgabenbeschreibung ziemlich dürftig.
dazu habe ich viel recherchiert, aber irgendwie will es unter IE nicht klappen.
Bitte recherchiere, warum "will nicht klappen" keine brauchbare Problembeschreibung ist.
a:hover hoverdiv { filter:none; }Worauf soll dieser Selektor deiner Meinung nach zutreffen?
Es gibt in (X)HTML kein Element mit dem Elementnamen hoverdiv.MfG ChrisB
--
Light travels faster than sound - that's why most people appear bright until you hear them speak.-
Hallo ChrisB,
vielen Dank für deine Antwort!
Ich hätte gedacht das die problembeschreibung klar aus Quellcode und meinem geschriebenen herausgeht. Ich versuche es nochmal spezifischer:
Ich möchte einen <a>-tag in ein block element umwandeln. Wenn man über das block element mit der maus rüber geht (hover) sollen diverse <span>-inhalte sichtbar werden (visible) und beim verlasssen der maus wieder unsichtbar.
Der Beispielquellcode den ich mitgeliefert habe, funktioniert ind FF, Opera, Safari usw, jedoch nicht in IE.
Ich suche nach einem Hack, den alle Browser verstehen, also auch der IE.a:hover hoverdiv { filter:none; }Worauf soll dieser Selektor deiner Meinung nach zutreffen?
Es gibt in (X)HTML kein Element mit dem Elementnamen hoverdiv.Dieser Selekttor soll auf folgendes Element zutreffen:
<a class="hoverdiv" id="hoverdiv" style="position:absolute;top:319px;left:0px;width:580px;height:107px;border-style:solid;"></a>Ich hoffe das war eindeutiger. Villeicht hast du ja eine Idee, warum das ganze im IE nicht funktioniert?
Vielen Dank nochmals für deine Antwort.
Grüße
Trom
-
a:hover hoverdiv { filter:none; }Dieser Selekttor soll auf folgendes Element zutreffen:
<a class="hoverdiv" id="hoverdiv" style="position:absolute;top:319px;left:0px;width:580px;height:107px;border-style:solid;"></a>Tut er aber nicht
Er matcht ein <hoverdiv> in einem <a> Element.mfg Beat
--
><o(((°> ><o(((°>
<°)))o>< ><o(((°>o
Der Valigator leibt diese Fische -
@@tromton:
nuqneH
a:hover hoverdiv { filter:none; }
Dieser Selekttor soll auf folgendes Element zutreffen:
<a class="hoverdiv" id="hoverdiv" style="position:absolute;top:319px;left:0px;width:580px;height:107px;border-style:solid;"></a>Wozu hat das Element sowohl eine ID "hoverdiv" als auch eine Klasse "hoverdiv"?
Du musst entweder den ID-Selektor oder den Klassenselektor verwenden, nicht aber den Nachfahrenselektor. [CSS2 §5]
Desweiteren solltest du alle Darstellungsangaben im Stylesheet notieren, nicht inline in 'style'-Attributen.
Und warum willst du 'filter' überhaupt auf "none" setzen? Wo wird dafür ein anderer Wert gesetzt?
Qapla'
--
Alle Menschen sind klug. Die einen vorher, die anderen nachher. (John Steinbeck)-
vielen dank für deine antwort.
ehrlich gesagt sind das alle produkte meines herumprobierens. man liest überall von diversen hack möglichkeiten, die es dem IE beibringen sollen. Ich verstehe gar nicht wozu filter da ist, ich hab es nur mal übernommen, es macht allerdings keinen unterschied ob es drin steht oder nicht.
es ist natürlich richtig das man die style angaben der ordnung nach besser im stylesheet angibt und nicht im style attribut. jedoch tut das ja auch bei dem problem nichts zur sache. css konform ist es laut validator allemal.danke und grüße
tromton
-
@@tromton:
nuqneH
Ich verstehe gar nicht wozu filter da ist
Ob das in http://de.selfhtml.org/@title=SELFHTML zu finden ist? Na schauen wir mal nach. Click.
Das Kapitel http://de.selfhtml.org/css/@title=CSS ist schnell gefunden. Click.
Das Unterkapitel http://de.selfhtml.org/css/eigenschaften/index.htm@title=CSS-Eigenschaften auch. Click.
Finden wir da was zu Filtern?
es ist natürlich richtig das man die style angaben der ordnung nach besser im stylesheet angibt und nicht im style attribut. jedoch tut das ja auch bei dem problem nichts zur sache.
Bei der Suche nach der Ursache von Problemen tut es das: Inline-Styles sind unübersichtlich.
Qapla'
--
Alle Menschen sind klug. Die einen vorher, die anderen nachher. (John Steinbeck)-
ist ok, ich gebe dir ja recht. du kannst mir natürlich erklären wie man was besser macht, aber die lösung des problem ist es ja doch leider nicht. aber da du natürlich recht hast anbei eine überarbeitete fassung.
soweit ich weis ist die filter anweisung dafür da gewesen, das der internet explorer das hover macht, was aber letzendlich nicht passiert. also kann ich sie auch weglassen wenn es besser ist.
<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01//EN" "http://www.w3.org/TR/html4/strict.dtd"> <html> <head> <meta http-equiv="Content-Language" content="en"> <meta http-equiv="Content-Type" content="text/html; charset=utf-8"> <META http-equiv="Content-Style-Type" content="text/css"> <style type="text/css"> a#hoverdiv { display: block; background:transparent; position:absolute; top:319px; left:0px; width:580px; height:107px; border-style:solid; background-image: url(img/empty.gif); } a span.onhover { visibility:hidden; position: relative; } a:hover span.onhover { visibility:visible; display:block; } span.onhover_span_1 { position:absolute; top:80px; left:0px; width:570px; height:17px; background-color:#cccccc; } span.onhover_span_2 { position:absolute; top:80px; left:522px; width:16px; height:16px; cursor:pointer; cursor:hand; } span.onhover_span_3 { position:absolute; top:80px; left:538px; width:16px; height:16px; cursor:pointer; cursor:hand; } span.onhover_span_4 { position:absolute; top:80px; left:554px; width:16px; height:16px; cursor:pointer; cursor:hand; } imgwoborder { border-style:none; } </style> <title> Test Document </title> </head> <body> <div> <a class="hoverdiv" id="hoverdiv"> <span class="onhover" id="onhover"> <span class="onhover_span_1">sdhsdh fg kjg sd fjgkj kljg f kjgjk lsdfgjkl fgjk l</span> <span class="onhover_span_2"><img src="img/grid.gif" title="grid view" alt="grip view" class="imgwoborder"></span> <span class="onhover_span_3"><img src="img/l_arrow.gif" title="previous" alt="previous" class="imgwoborder"></span> <span class="onhover_span_4"><img src="img/r_arrow.gif" title="next" alt="next" class="imgwoborder"></span> </span> </a> </div> </body> </html>also ich würde mich über konstruktive tipps zu der problematik freuen, das der IE bei diesem Beispiel nicht hovert.
tausend dank.
trom
-
@@tromton:
nuqneH
Kann man sich das online anschauen? Denn …
<span class="onhover_span_2"><img src="img/grid.gif" title="grid view" alt="grip view" class="imgwoborder"></span>
Isch ’abe gar kein "img/grid.gif".
Qapla'
--
Alle Menschen sind klug. Die einen vorher, die anderen nachher. (John Steinbeck) -
Hallo Tromton,
damit das hier nichts ins Endlose ausufert, sieh Dir http://aktuell.de.selfhtml.org/artikel/css/infobox/ bitte an! Es ist nicht alles mittels CSS lösbar. Was einem der IE nicht (mit CSS) ermöglicht, kann ergänzt werden. Gunnar hat auch mal eine Kurzbeschreibung der CSS Erweiterung Expression geschrieben.
Ein Anwendungsbeispiel, was sich für Dich nutzen ließe:
p:hover {background:red} p {hover:expression(this.onmouseover=new Function("this.style.background='red';"),this.onmouseout=new Function("this.style.background='trasparent';"));<p>test</p>Gruß aus Berlin!
eddi -
Hi,
ist ok, ich gebe dir ja recht. du kannst mir natürlich erklären wie man was besser macht, aber die lösung des problem ist es ja doch leider nicht.
Nicht, wenn du dabei nicht mitarbeitest.
imgwoborder { border-style:none;Schon wieder ein Selektor, bei dem man fragen muss, worauf bitte soll der wirken?
Auf den bereits doppelt erfolgten Hinweis, dass der Selektor, nach dem ich dich zuerst gefragt hatte, *nicht* das macht, was du glaubst, bist du nicht wieder eingangen.
Dass du deshalb jetzt hier schon wieder zeigst, dass du hinsichtlich Selektoren kaum Ahnung hast, aber dich inzwischen auch nicht bemüht hast, daran was zu ändern, ist ärgerlich.
also ich würde mich über konstruktive tipps zu der problematik freuen, das der IE bei diesem Beispiel nicht hovert.
Konstruktiver Tipp, erneut: Mach dir bitte erst mal klar, was dein Code, so wie du ihn geschrieben hast, bedeutet!
Dann weisst du anschliessend auch, wo du etwas verbessern muss, weil das derzeit geschriebene gar nicht das ist, was du willst.
MfG ChrisB
--
Light travels faster than sound - that's why most people appear bright until you hear them speak.
-
-
-
-
-
-