2017-01-23 1 views
-1

Ich muss eine Website arbeiten in der gefürchteten IE bis 8 leider - Es ist eine lange Zeit seit ich etwas mit 8 zu tun hatte, so habe ich mit dem folgenden zu kämpfen.Wie kann ich Elemente in IE8 ein- und ausblenden?

Ich bin mit einem Modernizr Check, die das folgende Skript für einen alten Browser ausgeführt wird:

$(".hp_header #bgvid, .hp_header .cd-background-wrapper").hide(); 
$(".hp_header .respy").show(); 
$(".hp_header #bgvid, .hp_header .cd-background-wrapper").css("display", "none"); 
$(".hp_header .respy").css("visible", "true"); 
$(".hp_header .respy").css("display", "block"); 
$(".hp_header .respy").css("width", "100%"); 

Leider sind die Sichtbarkeit und Anzeigeoptionen von IE8 völlig ignoriert, was soll ich tun?

+1

Ihre Frage unklar ist. Welcher Teil davon funktioniert nicht? Auf welches DOM soll dieser Code angewendet werden? –

+1

*** Wenn *** '.respy' ein Element ist, das standardmäßig auf 'inline-block' oder 'inline' (wie 'span') gesetzt ist, kann IE8 es nicht als' block' behandeln. Das ist nur die Realität des alten IE. Beachten Sie auch, dass es keine "sichtbare" CSS-Eigenschaft gibt (es gibt 'visibility', aber keinen' true'-Wert, sondern 'visible',' hidden' oder 'collapse'). –

+2

[Sichtbarkeit] (https://developer.mozilla.org/en/docs/Web/CSS/visibility) und [display] (https://developer.mozilla.org/en-US/docs/Web/CSS/ Anzeige) arbeiten Sie den ganzen Weg zurück zu IE4, so sollten Sie keine Probleme haben. Können Sie genau beschreiben, was das Problem ist? –

Antwort

1

Wahrscheinlich nicht die Antwort, die Sie suchen, sondern eher eine Anregung. Sie könnten bedingte HTML-Anweisungen verwenden, wie diese

<!DOCTYPE html> 
<!--[if lt IE 7 ]> <html class="ie ie6"> <![endif]--> 
<!--[if IE 7 ]> <html class="ie ie7"> <![endif]--> 
<!--[if IE 8 ]> <html class="ie ie8"> <![endif]--> 
<!--[if IE 9 ]> <html class="ie ie9"> <![endif]--> 
<!--[if (gt IE 9)|!(IE)]><!--> 

Dann könnten Sie tun, alles CSS ist wie folgt:

.ie8 .hp_header #bgvid, 
.ie8 .hp_header .cd-background-wrapper { 
    display:none; 
} 

.ie8 .hp_header .respy { 
    display:block; 
    width:100%; 
    visibility:visible; 
} 
Verwandte Themen