Mein letzter Post erklärte die spezielle Behandlung von Internet Explorer 6 (und jünger) in meinem Blog. Es wird statt dem eigentlich Inhalt ein bisschen Text und Links zu vernünftigen Browsern angezeigt.
Ich wollte dieses „Feature“ jetzt mit nur 1 Zeile realisieren. Den CSS und HTML Code in der tatsächlich index stehen zu haben ist unschön.
Daher präsentiere ich:
IE-Buster
a small jQuery Anti-IE Plugin
Frei nach dem Motto:
„If there’s something strange
in the internet.
Who ya gonna call?“
IE-Buster!!!
😉
Das Plugin ist nur 2,3KB groß und damit ein Leichtgewicht im Anti IE Geschäft. Es epfiehlt sich also wenn man keinen besonders hübschen und funktionsreichen Abgang beim IE sucht, sondern etwas kleines, schnelles und unkompliziertes.
Einzige Voraussetzung: jQuery muss eingebunden sein!
$(document).ready(function() { $("head").append('<!--[if lte IE 6]><style type="text/css">#ie6-warning { display: block; width: 100%; height: 100%; background-color: white; position: absolute; z-index: 1111; top: 0px; left: 0px; color: black; padding: 10%; font-size: 17px; } #ie6-warning td { border: 1px solid #eee; padding: 4px; color: white; } #ie6-warning a { color: blue; }</style><![endif]--><!--[if gt IE 6]><style type="text/css">#ie6-warning { display: none!important; }</style><![endif]-->'); $("body").append('<div id="ie6-warning">Ihr Browser ist zu alt um diese Internetseite korrekt darzustellen.<br/>Bitte aktualisieren Sie Ihren Browser oder installieren Sie einen anderen modernen Browser.<br/><br/>Your browser is too old to display this website correctly.<br/>Please update your browser or install another modern browser.<br/><br/><br/><table cellpadding="10"><tr><td></td><td>Google Chrome</td><td>Mozilla Firefox</td><td>Opera</td><td>Apple Safari</td><td>Microsoft Internet Explorer</td></tr><tr><td>Download (DE):</td><td><a href="http://www.google.de/chrome/">Link</a></td><td><a href="http://www.mozilla-europe.org/de/firefox/">Link</a></td><td><a href="http://de.opera.com/">Link</a></td><td><a href="http://www.apple.com/de/safari/">Link</a></td><td><a href="http://www.microsoft.com/germany/windows/internet-explorer/">Link</a></td></tr><tr><td>Download (EN):</td><td><a href="http://www.google.com/chrome/">Link</a></td><td><a href="http://www.mozilla-europe.org/en/firefox/">Link</a></td><td><a href="http://www.opera.com/">Link</a></td><td><a href="http://www.apple.com/safari/">Link</a></td><td><a href="http://www.microsoft.com/windows/internet-explorer/">Link</a></td></tr><tr><td>Suchen/Search for:</td><td><a href="http://www.google.com/search?q=chrome">Link</a></td><td><a href="http://www.google.com/search?q=firefox">Link</a></td><td><a href="http://www.google.com/search?q=opera">Link</a></td><td><a href="http://www.google.com/search?q=safari">Link</a></td><td><a href="http://www.google.com/search?q=internet+explorer">Link</a></td></tr></table><br/><br/><span>by <a href="http://it-stack.de">Hannes Schurig</a></span></div>'); });
Download des Plugins v1.2
ie-buster-1.2 [.js] (Rechtsklick -> Speichern unter)
Nicht vergessen, regelmäßig nach Updates schauen.
oder
Einbinden der neuesten Version von meinem Server
<!-- <script type="text/javascript" src="jquery-min.js"></script> // (noch) Voraussetzung: jQuery! --> <script type="text/javascript" src="http://public.hannes-schurig.de/IE-Buster/ie-buster-latest.js"></script>
v1.2 – Anzeigefehler behoben
v1.1 – Anzeigefehler behoben
Könntest ja aus aktuellem Anlass einen Link auf http://ie6countdown.com/ einbauen. ^^
Ich persönlich halte nichts von solchen Aktionen. Deine Leser sind Leute, die sich für Computer interessieren und man kann annehmen, dass die meisten schon einen modernen Browser verwenden. Wenn nicht, dann kann man ihnen sowieso nicht helfen.
Ansonsten schließt du alle Leser aus, die vlt. von der Arbeit & Schule ect. aus surfen, wo nur IE6 drauf ist.
Ich habe diese Seite probeweise mit dem Fx und dem User Agent Switcher mit eingestelltem IE6 aufgerufen. Es war keine Meldung zu erkennen. Oder habe ich etwas missverstanden?
Dann erkennt das Statement
wohl immernoch den Firefox und wird nicht aktiv, würde ich zumindest denken.
Mit IETester funktionierts und da wird der IE 6 nicht nur simuliert sondern installiert.
Ist doch kein Wunder, dass es nicht funktioniert, wenn man den Agent-Switcher verwendet. Das einzige, was das Teil macht, ist, einen anderen User-Agent String an den Server zu schicken. Der Code von Hannes basiert jedoch auf den Conditional Tags, die explizit nur vom IE interpretiert werden.
Das klingt coolerweise absolut einleuchtend 🙂
Was die Kritik angeht, dass der Besucher vielleicht gezwungen ist den IE 6 zu benutzen und dennoch die „gesperrte“ Seite sehen möchte; das hat Kenny ebenfalls schon angemerkt und nach einem Update wird es möglich sein die Seite dennoch zu besuchen.
Also eine Art Button… „Ich wurde auf die unfassbar große Schwachsinnssoftware hingewiesen, mit der ich mich durch das Internet bewege, möchte die Seite aber trotzdem sehen!„
bin ich zu blöd oder check ich es nicht? ich hab den schnipsel direkt von deinem server bei mir im wordpress header.php eingebunden, aber es tut sich nix…
woran kann liegen?
Ehrlich gesagt, keine Ahnung. :-/
Beispiel: http://iqb.hannes-schurig.de/css-function.html
Diese Seite habe ich gerade eben mit der 1 Codezeile aus dem Artikel (das „latest“ Script wird von meinem Server eingebunden) versehen.
Vorher konnte ich mit dem IE 6 (IE-Tester verwendet) die Seite normal sehen, mit allen anderen Browsern auch.
Jetzt wird bei IE 6 die gewollte Meldung angezeigt, bei IE 7 und allen anderen Browsern bleibt die Seite unverändert.
Screenshot: Bild
Hast du das Script heruntergeladen oder den Server-Link genutzt? Wenn du die Datei manuell genutzt hast dann probier bitte mal den Link zum Einbinden von meinem Server.