Opera-nein MSIE5.x-ja Weiche
Axel Richter
- css
Hallo,
CSS-Browserweichen, die so arbeiten, dass bestimte Angaben nur von Opera6+ und/oder Mozilla interpretiert werden, aber von MSIE5.x und/oder Netsape4.x nicht, gibt es ja einige. Aber gibt es auch etwas, was _nur_ Opera nicht kennt, aber MSIE5.5 schon? Es geht um folgendes Problem:
Opera6.x kann Hintergrundbilder nicht via CSS-hover-Pseudoklasse verändern. Er "verschluckt" beim Versuch das vorhandene Hintergrundbild einfach. Ich möchte deshalb, das Opera6 dies beim hovern auch gar nicht versucht. Folgendes funktioniert zwar, ist aber nicht Standardkonform, weil es kein <noscript> im head gibt. Andere Browser sollen das CSS aber auch bei abgeschaltetem JavaScript erhalten.
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN"
"http://www.w3.org/TR/html4/strict.dtd">
<html>
<head>
<title></title>
<style type="text/css">
<!--
div.m a {display:block; width:200px; background-image:url(dede020.gif);}
-->
</style>
<script type="text/javascript">
<!--
if (!window.opera) {
document.writeln("<style type="text/css">");
document.writeln("div.m a:hover {background-image:url(dede024.gif);}");
document.writeln("</style>");
}
//-->
</script>
<noscript>
<style type="text/css">
<!--
div.m a:hover {background-image:url(dede024.gif);}
-->
</style>
</noscript>
</head>
<body>
<div class="m">
<a href="#">Linktext</a>
</div>
</body>
</html>
Gibt es eine reine CSS-Weiche, die Opera6 _nicht_ kennt, MSIE5.x aber kennt?
viele Grüße
Axel
Hallo, Axel,
Aber gibt es auch etwas, was _nur_ Opera nicht kennt, aber MSIE5.5 schon?
Einen solchen Selektor gibt es vermutlich nicht. Du musst also mit drei Regeln arbeiten: eine simple, die alle Browser bedient, das heißt in erster Linie deinen anvisierten MSIE 5.5, genauer gesagt wahrscheinlich MSIE >4 (Mutmaßung, kann es morgen aber überprüfen, falls du es exakt wissen möchtest). Die zweite Regel sollte der MSIE nicht können, dafür aber der Opera 6 und andere Browser, die CSS2-Selektoren verstehen. In dieser Regel werden die speziellen Styles für Opera 6 untergebracht. In der dritten Regel, welche noch komplexere Selektorsyntax enthält, welche von Opera 6 nicht verstanden wird, werden die Eigenschaften der zweite Regel für Gecko-Browser, vermutlich Konqueror und ähnlich weit entwickelte Browser mit denselben Deklarationen der ersten Regel überschrieben.
Gibt es eine reine CSS-Weiche, die Opera6 _nicht_ kennt, MSIE5.x aber kennt?
John Wilkins' »Owen Hack« mit Tantek Çeliks »Be nice to Opera«-Teil. http://www.albin.net/CSS/OwenHack.html. Falls du nur Opera 6 und nicht Opera <6 erreichen willst, nimmst du zusätzlich den »Be mean to Opera«-Hack.
Sollte hier aber nicht nötig sein, da 5.12 auch den von dir beschriebenen Bug hat. Opera 7 versteht hingegen den Selektor des Owen Hacks, und er kann auch Hintergründe per CSS austauschen, insofern solltest du damit gute Erfolge erzielen können.
Ein Beispiel: http://home.t-online.de/home/dj5nu/fanhost/opera-bghover.html
Opera 6.05 (und 5.12) ändert den Hintergrund nicht, dafür musst du background-image:none angeben. Das ist zwar unlogisch, aber wenn dort der Ausgangswert url(...) angegeben wird, verschluckt Opera das Hintergrundbild trotzdem. Mit »none« läuft's komischerweise, das heißt, Opera (getestet mit 5.12 und 6.05) übernimmt das Bild aus der Regel mit dem Selektor »#menue a«.
MSIE 6, Mozilla 1.3/Phoenix 0.5 und Opera 7.03 zeigen den Hover-Effekt wie gewünscht an. Über das Verhalten anderer Browser kann ich zunächst keine Auskunft geben - das könnte eventuell problematisch werden.
Grüße,
Mathias
Hallo Mathias,
Gibt es eine reine CSS-Weiche, die Opera6 _nicht_ kennt, MSIE5.x aber kennt?
John Wilkins' »Owen Hack« mit Tantek Çeliks »Be nice to Opera«-Teil. http://www.albin.net/CSS/OwenHack.html.
Ja, den hatte ich gefunden, wußte aber nicht, wie man dem Opera beibringt, dass er das Hintergrundbild _nicht_ ändern soll, wenn man _vorher_ ihm und den Anderen gesagt hat, dass er es ändern soll ;-))
Ein Beispiel: http://home.t-online.de/home/dj5nu/fanhost/opera-bghover.html
Opera 6.05 (und 5.12) ändert den Hintergrund nicht, dafür musst du background-image:none angeben. Das ist zwar unlogisch,
Ja, ne? Das background-image:inherit; hatte ich probiert. Das wäre logisch.
Danke, jetzt geht es. Mein Problem war allerdigs noch etwas komplexer, weil ich gleichzeitig zum Hintergrundbild auch die Hintergrundfarbe ändere. Opera6 reicht auch schon das Ändern der Hintergrundfarbe (scheinbar allgemein des Hintergrundes), um das Bild zu verschlucken. Das lässt sich aber mit der selben "Logik" umgehen. Setzt man, nur für Opera6, die Hintergrundfarbe auf transparent zurück, dann ändert er sie _nicht_ . Allgemeine Opera-Logik: Das Zurücksetzen des Hintergrundes auf die Standardwerte bewirkt keine Änderung, jede Änderung bewirkt das Zurücksetzten des Hintergrundbildes auf den Sandardwert *lol*.
div.m a:link {color:#007070;}
div.m a:visited {color:#005050;}
/*Für alle, die über @media kommen*/
div.m a:hover {color:#00B0B0; font-weight:bold; background-color:#F0F0F0;}
/*Für CSS2-Browser, speziell Opera6, der bei Änderung des Hintergrundes das Hintergrundbild verschluckt.*/
html>body div.m a:hover {color:#00B0B0; font-weight:bold; background-color:transparent;}
/*Für CSS2-Browser, außer Opera6*/
head:first-child+body div.m a:hover {color:#00B0B0; font-weight:bold; background-color:#F0F0F0;}
div.m a:active {color:#C04040;}
div.m a:focus {color:#00B0B0;}
/*Ausgangszustand*/
div.m a#home {background-image:url(home.gif); background-repeat:no-repeat;}
/*Für alle, die über @media kommen*/
div.m a#home:hover {background-image:url(homehover.gif); background-repeat:no-repeat;}
/*Für CSS2-Browser, speziell Opera6, der bei Änderung des Hintergrundes das Hintergrundbild verschluckt.*/
html>body div.m a#home:hover {background-image:none;}
/*Für CSS2-Browser, außer Opera6*/
head:first-child+body div.m a#home:hover {background-image:url(homehover.gif); background-repeat:no-repeat;}
viele dankbare Grüße
Axel
Hallo,
Ja!, gibt es (siehe meinen eigen Forumsartikel - Verschiedene Style Sheets fuer NN4, winie, Opera, Konqueror und Mozilla - und http://www.goewe.com/bi/hideCSS.html als Beispiel)
mit der media-Angabe (J.R.Pozo) media="sareen" blockt man nur Opera (zumindest 6.0 beta - ich hab keine moeglichkeit dies mit andren Operas zu testen)
Mit media="all" verhindert man Opera und NN4.
Umgekehrt blockt man NN4, Konqueror und WinIE (mindestens 5.0 und 5.5 - 6.0 und hoeher kann ich nicht testen).
Damit bleiben nur noch die unproblematischen Mozillas uebrig, fuer die bisher keine hiding-Methode gefunden wurde.
gruss goewe.
Hallo,
Ja!, gibt es (siehe meinen eigen Forumsartikel - Verschiedene Style Sheets fuer NN4, winie, Opera, Konqueror und Mozilla - und http://www.goewe.com/bi/hideCSS.html als Beispiel)
mit der media-Angabe (J.R.Pozo) media="sareen"
media="scReen" ;-))
http://html.conclase.net/pruebas/hacko5.html
blockt man nur Opera (zumindest 6.0 beta - ich hab keine moeglichkeit dies mit andren Operas zu testen)
Mit media="all" verhindert man Opera und NN4.
Danke auch Dir. Die andere Methode (von molily) ist mir aber lieber, rein gefühlsmäßig. Eventuell denke ich noch mal länger drüber nach.
viele Grüße
Axel
Hallo,
mit der media-Angabe (J.R.Pozo) media="sareen" blockt man nur Opera (zumindest 6.0 beta - ich hab keine moeglichkeit dies mit andren Operas zu testen)
Ja, aber leider auch Opera 7, damit ist diese Methode hier ungeeignet.
Als Anmerkung: Es müsste übrigens exakt screen heißen, falls es »screen« ergeben soll (Axels Gegenvorschlag erzeugt »scReen«, was aber denselben Effekt hat).
Mit media="all" verhindert man Opera und NN4.
Schlecht, auch diese Methode blockt Opera 7. Nervig ist sogar, dass Opera das link-Element nicht igoriert, sondern das Stylesheet zwar vom Server bezieht, es aber nicht anwendet.
Grüße,
Mathias
Hallo, a war natuerlich falsch, muss screen heissen.
Blockt auch Opera 7, damit ist diese Methode hier ungeeignet.
Mir kommt es nur darauf an, dass der Inhhalt lesbar ist und alls links anklickbar bleiben.
Es waere fuer mich viel einfacher nur fuer Text-Browser zu programmieren!
Die hiding-Methoden geben jedenfalls fuer einige Browser die Moeglichkeit 'gefahrlos' extravagate Wbsites mit Hilfe von CSS zu programmieren.
Mir ist es jedenfalls lieber einen Browser zu Blocken der ein Style Sheet verstanden haette, als mit einem noch gebraeuchlichen Browser Probleme zu haben!
Uebrigens: Fuer Galeon und Konqueror gibt es die Moeglichkeit ein 'alternate stylesheet' auszuwaehlen welches dann `die Letzten Moeglichkeiten von CSS ausnutzt.
ps: Um NN4 zu blocken kann man auch media="screen,dummy" schreiben.
gruss a.goewe.
Hallo,
Blockt auch Opera 7, damit ist diese Methode hier ungeeignet.
Mir kommt es nur darauf an, dass der Inhhalt lesbar ist und alls links anklickbar bleiben.
Dafür ist strenggenommen kein Stylesheet nötig und schon gar keine vergleichsweise hochkomplexe und in letzter Konsequenz unkalkulierbare Browserweiche. Aber darum ging es Axel vermutlich nicht, dennoch gebe ich dir Recht, im Zweifelsfall sollte er auf die Effekte verzichten.
Es waere fuer mich viel einfacher nur fuer Text-Browser zu programmieren!
Was hat das mit dem Thema und vor allem Axels Frage zu tun?
Die hiding-Methoden geben jedenfalls fuer einige Browser die Moeglichkeit 'gefahrlos' extravagate Wbsites mit Hilfe von CSS zu programmieren.
Diese Methoden sind alles andere als gefahrlos, siehe auch [pref:t=41865&m=229166] ff.
Mir ist es jedenfalls lieber einen Browser zu Blocken der ein Style Sheet verstanden haette, als mit einem noch gebraeuchlichen Browser Probleme zu haben!
Wieso würde hier ein noch gebräuchlicher Browser Probleme haben? Ich sprach mich übrigens nicht komplett gegen einen Workaround aus.
Es ging hier sowieso einen für die Grundfunktionalität völlig unerheblichen Effekt. Zudem sollte dieser optionale Effekt so angelegt werden, dass *ein* Browserbug umschifft wird, folglich nur um negative Auswirkungen zu verhindern. Für dieses punktuelle Problem ist auch eine punktuelle Lösung nötig, insofern würde ich höchstens dazu raten, den Opera-spezifischen Teil deines Vorschlags zu nutzen (mit den geäußerten Einwänden). Dabei ist meiner Meinung nach aber nicht mehr Stabilität und Nachhaltigkeit gewährleistet, da die Treffsicherheit nicht abschätzbar ist.
Uebrigens: Fuer Galeon und Konqueror gibt es die Moeglichkeit ein 'alternate stylesheet' auszuwaehlen welches dann `die Letzten Moeglichkeiten von CSS ausnutzt.
Was hat das mit alternativen Stylesheets zu tun? Wie soll das funktionieren, werden dabei bewusst Browserbugs ausgenutzt? Alternativstylesheets erfüllen einen anderen Zweck als als Primärstylesheet für bestimmte Browser zu dienen (falls du das meintest).
Grüße,
Mathias
nochmal Hallo,
Nervig ist sogar, dass Opera das link-Element nicht igoriert, sondern das Stylesheet zwar vom Server bezieht, es aber nicht anwendet.
Aus der Sicht von Opera ist dies so:
<link ... href="style.css" media="screen" > bedeutet, dass style.css nicht fuer die Bildschirmausgabe ist, es muesste ja sonst exakt 'screen' dastehen.
Opera laesst aber zu, dass in style.css via
@import url(opera.css) screen;
ein weiteres, fuer die Bildschirmausgabe bestimmtes style sheet geladen wird.
gruss a.goewe.
Hallo,
Nervig ist sogar, dass Opera das link-Element nicht igoriert, sondern das Stylesheet zwar vom Server bezieht, es aber nicht anwendet.
Aus der Sicht von Opera ist dies so:
<link ... href="style.css" media="screen" > bedeutet, dass style.css nicht fuer die Bildschirmausgabe ist, es muesste ja sonst exakt 'screen' dastehen.
Ja, das ist mir bekannt.
Opera laesst aber zu, dass in style.css via
@import url(opera.css) screen;
ein weiteres, fuer die Bildschirmausgabe bestimmtes style sheet geladen wird.
Ja, und, was willst du mir damit sagen? Der kritische Punkt ist nicht, wie man Opera screen-Stylesheets vorsetzt, sondern die Tatsache, dass Opera (und übrigens auch anscheinend Gecko und MSIE6) ein Stylesheet vom Server bezieht, welches er wissentlich nicht anwendet, da es für einen Ausgabemedientyp gilt, welcher nicht unterstützt wird, unbekannt ist beziehungsweise im speziellen Fall nicht als ein unterstützter erkannt wird. Dieser Umstand stört erheblich, wenn man diese Methode zweckentfremden will, um ein externes Stylesheet vor einem Browser zu verstecken, schließlich ist es äußerst unsinnig, dass der Browser dieses Stylesheet überhaupt vom Server anfordert.
Mein Einwand bezüglich des immensen HTTP-Traffics gilt folglich auch in diesem Fall ganz besonders.
Grüße,
Mathias