CSS-Problem: a:hover funktioniert nicht mit IE (css-Ninja gebraucht)

Warum also nicht den hintergrund ändern, die Farbe auf meiner Seite für tabs a:hover aber nicht so in Firefox/Chrome/Safari korrekt?

Was kann ich tun, damit es funktioniert in IE 6+?

HTML

<ul class="tabbernav">
<li class="tabberactive"><a title="All" href="javascript:void(null);">All</a></li>
<li class=""><a>Tab1<span class="tabTotal"> (0)</span></a></li>
<li class=""><a>Tab2<span class="tabTotal"> (2)</span></a></li>
<li class=""><a>Tab3<span class="tabTotal"> (1)</span></a></li>
</ul>

CSS

ul.tabbernav li a:hover {background:#fdfdfd; border: 1px solid #555; border-bottom: none; color:#3366a9; cursor: pointer}
Vielleicht bin ich etwas fehlt, aber wenn ich Ihre Quelle, ich sehe die genannten Punkte als eine Liste. Ich sehe es als div ' s mit h2-tags.
Auch Sie scheinen nicht zu irgendwelche links gibt es entweder für diese Elemente. Also, diejenigen Gründe, die kombiniert werden, sind genug, um es nicht korrekt funktionieren.
Ich habe aktualisiert die original-Beitrag, die code enthalten
Nur eine Idee...Was passiert, wenn Sie ändern .Dokument. .Fenster. in der inline-js?
ändern .Dokument zu .Fenster hat keine Auswirkung

InformationsquelleAutor TimJK | 2009-08-18

  1. 8

    Erste, was ich tun würde, ist, überprüfen Sie, dass die Reihenfolge der Pseudo-Selektoren korrekt ist.

    Sollte es sein-

    a:link {color:#FF0000} /* unvisited link */  
a:visited {color:#00FF00} /* visited link */  
a:hover {color:#FF00FF} /* mouse over link */  
a:active {color:#0000FF} /* selected link */

    Nur bestimmte IE-hover Frage ich mich erinnere, bezieht sich auf nicht-link-Elemente, also denke ich nicht, dass ist Ihr Problem. http://www.bernzilla.com/item.php?id=762 - Nur für den Fall.

    Wenn das nicht die Antwort auf Ihre Frage do you mind posting den entsprechenden block von css?

    GAH - Das war hart!

    Sieht es aus wie der IE zu brechen, weil die links nicht über eine zugehörige Href-element. Beheben, und Sie sollten in Ordnung sein.

    --Breaking News - ich bin vielleicht ein Trottel - das war das Letzte was ich geändert habe auf meiner test-Seite, und dass es behoben aber wenn ich alles wieder zusammen brach überall... also nehmen, was ich gerade geschrieben mit einem Körnchen Salz. Ich bin sichern, um zu sehen, was passiert.

    Ich habe aktualisiert die original-Beitrag, die code enthalten
    Huch. Guten job.
    Danke! - Ich kann nicht meine test-Datei auf jedem browser jetzt, obwohl ich schon wieder zu der original-code. Ich denke, es war schwarze Magie am Werk hier. Hoffentlich ist alles gut jetzt, und wenn ich nur brennen Sie die Datei test wir werden alle ok sein.
    Ich habe versucht eine Antwort zu finden, für bewegen Sie den Mauszeiger auf button-Elemente im IE7 überall, und jeder hat die gleichen "javascript" Antwort, die ich nicht mag. Hinzufügen der HTML 4.0-DTD arbeitete wie ein Weltmeister. Danke!

    InformationsquelleAutor Kelly Gendron

  2. 8

    Sollten Sie href="" Attribut in <a> tag.

    Diese funktionieren.

    Verwenden auch die <!doctype html> tag an der Spitze der Seite. Jetzt wird alles in Ordnung sein.

    In meinem Fall hatte ich eine :hover auf eine <div> element. Mit der <!doctype html> Erklärung war genug, um es arbeiten.
    Danke, ich habe gerade vergessen, die <!doctype html>

    InformationsquelleAutor thinzar

  3. 1

    Dies ist so eine einfache Lösung! Background-color:#fffffe, wenn die änderung background-color:#fff background:#fff funktioniert nicht.

    http://haslayout.net/css/Hover-White-Background-Ignore-Bug

    InformationsquelleAutor Johan De Silva

  4. 1

    Hinzufügen Schlag tag zu <head> für fix it.

    für IE9

    <meta http-equiv="X-UA-Compatible" content="IE=9">

    für IE10

    <meta http-equiv="X-UA-Compatible" content="IE=10">
    Diese Feste mein Problem am IE11, ich benutzt den IE=10. Nicht brechen, Firefox oder Chrome-mit dieser Zeile Links in.

    InformationsquelleAutor ali bagheri

  5. 0

    Deine CSS aussieht, um gültig zu sein.

    Versuchen Sie ein"!wichtig' zu a:hover, und versuche auch die änderung anderer Stile in der definition. Können Sie einige andere Stil überschreiben, dass insbesondere die a:hover-Stil über cascade.

    Firebug im FF kann Ihnen zeigen einige widersprüchliche Stile vererbt (obwohl im IE6 sind Sie auf Ihrem eigenen natürlich), aber Sie sollten sicherstellen, dass Sie nicht in Konflikt. a:hover funktioniert im IE6, wie Sie und andere in Frage zu stellen, sind aweare von

    Außerdem setzen von Semikolons und Zeilenumbrüche nach Ihren Erklärungen, die Sie dreckigen Heiden!

    Die seltsam finde ist, dass buchstäblich keine Rolle, was ich im inneren "ul.tabbernav li a:hover", IE 6+ nicht erkennt, es aber andere Browser tun. Also, wenn ich die SCHRIFTART ändern, oder die TEXT-DEKORATION, usw... IE 6+ passt nicht, aber alle anderen browser tun. Mit diesem der Fall !wichtig ist natürlich nicht. Es ist, als gedacht, IE 6+ wird auch bemerken, ich habe erklärt, alles, was in "ul.tabbernav li a:hover"

    InformationsquelleAutor jscharf

  6. 0

    Ich bin immer ein javascript-Fehler (Ungültiger Eigenschaftswert) im IE in Zeile ~852:

    document.getElementById('panel-hlisting-all').style.backgroundColor = color;

    denen Farbe den Wert "#ffff100".

    Könnte dies die Ursache des Problems?

    InformationsquelleAutor uhleeka

  7. 0

    Dachte nur, es jetzt - warum nicht mit Jquery zu tun? mit nur WENIGEN Zeilen code haben Sie es getan.

    Ersten, download Jquery von http://www.jquery.com. Dann sollten Sie richtig link zu Ihrer Datei, die auf dem Kopf des HTML:

    <script src="url_to_your_jquery_file_here"></script>

    Fügen Sie dann einen anderen Teil von Javascript ist unter diesen:

    <script type="text/javascript" language="javascript">
    $(document).ready(function() {
        $("li a").hover(
          function () {
            $(this).css("color", "#3366a9");
          }, 
          function () {
            $(this).css("color","#838383");
          }
        );
    });
</script>
    Was ist der code?
    Ok, viel mehr als 1 Linie des Codes 🙁 aber es sollte trotzdem funktionieren.
    Würde ich setzen und entfernen Sie eine .hover Klasse statt, und tun das styling in css durch welche ul.tabbernav li a:hover, ul.tabbernav li a.hover { ... }. Wenn Sie eine Aktualisierung der Antwort zu tun, so erhältst du +1. :p

    InformationsquelleAutor Bruno Schweller

  8. 0

    Glaube ich IE 7 behoben, durch das hover-problem auf andere Elemente als <a>, aber noch nicht getestet.

    Make-up für den IE 6 ist die fehlende Unterstützung für die :hover-Selektor, müssen Sie nur javascript verwenden, um dieselbe Wirkung zu bekommen. Legen Sie ein onMouseOver-Ereignis gilt, dass die Klasse, die Sie möchten. 😀

    Diese wird angewandt, um a:hover, ich glaube, du bist unter Bezugnahme auf IE 7+ Fähigkeit zur Anwendung :bewegen Sie zu mehr als nur hyperlinks. Ich nicht anwenden müssen, dies alles mit AUSNAHME von hyperlinks, also ich glaube nicht, Ihre Antwort gilt
    IE6 hatte nie ein problem mit dem schweben auf <a> - Elemente. Nur alle anderen Elemente.
    genau.
    Ich habe aktualisiert die original-Beitrag, die code enthalten
    danke, Frage bearbeitet. ;D

    InformationsquelleAutor Gordon Gustafson

  9. 0

    Ich versuchte jede Lösung, die ich gefunden. In meinem Fall war der Fehler bestimmt durch die Google Übersetzer. Entfernt habe ich es im IE und Opera (wo es andere Fehler verursacht) und alles funktioniert Prima.

    InformationsquelleAutor Hatzegopteryx

  10. 0

    Versuchen Sie, hinzufügen:

    display: block;
position: relative;

    zu Ihrer css -a.

    InformationsquelleAutor DLF

  11. 0

    Verwenden <!DOCTYPE html> an der Spitze der Seite. Es wird das problem zu beheben und andere Probleme, die entstehen können.

    InformationsquelleAutor Jeight

  12. 0

    Hover-element im quirk-Modus im IE nicht funktioniert. Alternative wird über eine script-Ereignis (ohne jquery) - html-element:

    <a onmouseover="this.style.textDecoration='underline'" onmouseout="this.style.textDecoration='none'" >  My link</a>

    InformationsquelleAutor lison

  13. 0

    können Sie fügen Sie die folgende Zeile an den Anfang der html-Datei, es funktioniert bei mir in 9:

           <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN" "http://www.w3.org/TR/html4/strict.dtd">

    InformationsquelleAutor

  14. 0

    können Sie fügen Sie die folgende Zeile an den Anfang der html-Datei, es funktioniert bei mir im ie 9:

           <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN" "http://www.w3.org/TR/html4/strict.dtd">

    InformationsquelleAutor

  15. -1

    Können Sie einen Ausdruck in Ihrem CSS. Ich verwende diese Technik, die ich entwickelt, um ein client-Website.

    Setzen Sie ihn einfach am ENDE des CSS, da Webkit-Browser kann nicht alles Lesen unten.

    * html * { color: expression( (function(who){ if(!who.MXPC){
 who.MXPC = '1';
 if(who.nodeName != 'A'){
  who.onmouseenter=function(){ who.className += ' hover'};
  who.onmouseleave=function(){ who.className = who.className.replace(' hover','')}; }
 (who==who.parentNode.firstChild) ? who.className += ' first-child' : '' ;
} } )(this) , 'auto') }
    Ich habe versucht, und es hat nicht funktioniert für IE 6

    InformationsquelleAutor Bruno Schweller

Schreibe einen Kommentar