 |
Wer verschiedene Layouts für verschiedene Browser programmiert, der will eine komfortable Möglichkeit haben, zur jeweils passenden Version weiterzuleiten. Unsere Browserweiche hilft dabei - sie fragt Browser, Browserversion, Bildschirmauflösung, Java-Unterstützung und Flash-Unterstützung ab. Am Ende des Scripts stehen einige Beispiel-Abfragen, die je nach Verwendungszweck erweitert werden müssen.
<script language= "JavaScript">
// Browser
ie = ((document.all) && (window.offscreenBuffering)) ? true : false;
nn = ((document.captureEvents) && (!document.getElementById)) ? true : false;
mz = ((document.getElementById) && (!document.all) && (document.documentElement)) ? true : false;
op = ((document.getElementById) && (navigator.userAgent.indexOf('Opera') != -1)) ? true : false
// Browser-Version
b_version = navigator.appVersion.substring(0,1);
// Bildschirm-Auflösung
r_small = (screen.width < 640) ? true : false; // Kleiner Bildschirm
r_640 = (screen.width >= 640) ? true : false; // Mindestens 640x480
r_800 = (screen.width >= 800) ? true : false; // Mindestens 800x600
r_1024 = (screen.width >= 1024) ? true : false; // Mindestens 1024x768
r_1280 = (screen.width >= 1280) ? true : false; // Mindestens 1280x1024
r_1600 = (screen.width >= 1600) ? true : false; // Mindestens 1600x1200
// Java?
javaok = (navigator.javaEnabled()) ? true : false;
// Abfragen
// z.B.: Weiterleitung zu einer Seite
if (ie && r_1280 && javaok && (b_version >= 4))
{
// IE, Auflösung größer als 1280x1024, Java an, Browserversion >= 4
document.location.href="xxyt.html";
}
if ((ie || nn) && r_800 && (b_version >= 3))
{
// IE oder NN, Auflösung größer als 800x600, Java wird nicht gecheckt, Browserversion >= 3
document.location.href="xxyt.html";
}
if (!(ie) && !(b_version >= 3))
{
// Kein IE und gleichzeitig Browserversion < 3
document.location.href="xxyt.html";
}
</script>
Es ist sinnvoll, hier noch einen <noscript>-Bereich einzubauen. Dort könnte der Anwender z.B. gebeten werden, manuell seine Systemkonfiguration auszuwählen. Gut ist dieser Ansatz jedoch nicht - viele Anwender wissen gar nicht, welche Bildschirmauflösung sie haben. Wir schlagen daher vor, bei ausgeschaltetem JavaScript Anwender auf eine Seite weiterzuleiten, die so kompatibel wie möglich ist - also optimiert auf 800x600, ohne Java und ohne Flash.
Flash ist in dieser Browserweiche noch nicht eingebaut. Es gibt zwar Möglichkeiten, auf Flash mit JavaScript zu prüfen. Das ist aus verschiedenen Gründen nicht gerade optimal: Auf vielen Systemen funktioniert diese Methode überhaupt nicht.
Ein anderer Ansatz - mit SSI - ist folgender: in die Startdatei wird eine kleine Flash-Datei eingebunden, die so schnell wie möglich zur auf Flash optimierten Version weiterleitet. Soll heißen: es wird nur dann weitergeleitet, wenn Flash funktioniert. Im HTML-Code wird ebenfalls eine Weiterleitung eingestellt, allerdings eine, die erst nach 10 Sekunden wirksam wird. Wenn Flash also aktiviert ist, dann wird die Weiterleitung innerhalb des Flash-Films aktiv. Wenn nicht, dann die HTML-Weiterleitung.
Zunächst sollten Sie sich also um den Flash-Film kümmern, der weiterleitet. Gute Artikel dazu gibt es von Macromedia oder auch von Flashworker.de.
Irgendwo müssen Sie also innerhalb Ihres Weiterleitungs-Films eine Weiterleitungs-URL eingeben. Setzen Sie hier die URL "weiche.shtml?flashok" ein. Vorausgesetzt, die die Weiche enthaltende Datei heißt auch "weiche.shtml", könnte der Code dann so aussehen. Ganz unten muss allerdings noch der passende Flash-Film mit Browserweiche eingebunden werden.
<html>
<head>
<META HTTP-EQUIV="Refresh" CONTENT="10;URL=weiche.shtml?noflash">
<script language= "JavaScript">
// Browser
ie = ((document.all) && (window.offscreenBuffering)) ? true : false;
nn = ((document.captureEvents) && (!document.getElementById)) ? true : false;
mz = ((document.getElementById) && (!document.all) && (document.documentElement)) ? true : false;
op = ((document.getElementById) && (navigator.userAgent.indexOf('Opera') != -1)) ? true : false
// Browser-Version
b_version = navigator.appVersion.substring(0,1);
// Bildschirm-Auflösung
r_small = (screen.width < 640) ? true : false; // Kleiner Bildschirm
r_640 = (screen.width >= 640) ? true : false; // Mindestens 640x480
r_800 = (screen.width >= 800) ? true : false; // Mindestens 800x600
r_1024 = (screen.width >= 1024) ? true : false; // Mindestens 1024x768
r_1280 = (screen.width >= 1280) ? true : false; // Mindestens 1280x1024
r_1600 = (screen.width >= 1600) ? true : false; // Mindestens 1600x1200
// Java?
javaok = (navigator.javaEnabled()) ? true : false;
// Flash
flash = false;
<!--#if expr="${QUERY_STRING} = 'flashok'" -->
flash = true;
<!--#endif -->
alert(flash);
// Abfragen
// z.B.: Weiterleitung zu einer Seite
<!--#if expr="${QUERY_STRING} != ''" -->
if (ie && r_1280 && javaok && (b_version >= 4) && flash)
{
// IE, Auflösung größer als 1280x1024, Java an, Browserversion >= 4, Flash an
document.location.href="xxyt.html";
}
if ((ie || nn) && r_800 && (b_version >= 3) && !(flash))
{
// IE oder NN, Auflösung größer als 800x600, Java wird nicht gecheckt, Browserversion >= 3, kein Flash
document.location.href="xxyt.html";
}
if ((!ie) && r_800 && (b_version >= 3))
{
// IE oder NN, Auflösung größer als 800x600, Java wird nicht gecheckt, Browserversion >= 3, Flash wird nicht gecheckt
document.location.href="xxyt.html";
}
<!--#endif -->
</script>
</head>
<body>
<!--#if expr="${QUERY_STRING} = ''" -->
<!-- Hier Flash-Film einbinden! -->
<!--#endif -->
</body>
</html>
|
|
|
|
Sie wollen diese Seite ausdrucken? Dafür haben wir eine spezielle Druckversion ohne grafische Elemente entwickelt! |
|
|
Einführung in CSS bei HTMLWorld.
|
|
