# screen

Allgemeines zur Verwendung

### Eigenschaften:

availHeight (verfügbare Höhe)
availWidth (verfügbare Breite)
colorDepth (Farbtiefe)
height (Höhe)
pixelDepth (Farbauflösung)
width (Breite)

## screen: Allgemeines zur Verwendung

Mit dem Objekt `screen` können Sie Angaben zum Bildschirm des Anwenders ermitteln. Diese Angaben werden oft dazu verwendet, das Layout einer Web-Seite oder die Fenstergröße an die zur Verfügung stehenden Bildschirmgröße anzupassen. Das `screen`-Objekt liefert jedoch im Hinblick darauf unzuverlässigen Werte, daher hat seine Bedeutung abgenommen. Das Auslesen der Größe desjenigen Bereiches im Browserfenster, in dem letztlich die Web-Seite letztendlich dargestellt wird, ist z.B. über window.innerWidth und document.body.offsetWidth möglich.
Das `screen`-Objekt ist bei Netscape und beim Internet Explorer ab den 4er Versionen verfügbar.

Eigenschaften des screen-Objekts können Sie direkt ansprechen, indem Sie `screen` davor notieren.

### Beispiel:

Anzeigebeispiel: So sieht's aus

    <html><head><title>Test</title>
    <script type="text/javascript">
    alert(screen.width + "x" + screen.height);
    </script>
    </head><body>
    </body>
    </html>

### Erläuterung:

Das Beispiel gibt beim Einlesen der Datei Breite (`screen.width`) mal Höhe (`screen.height`) des Anwenderbildschirms aus. Es handelt sich dabei um die Angabe in Pixeln, Ergebnisse sind also etwa `800x600` oder `1024x768`.

## availHeight

Speichert die maximal verfügbare Bildschirmhöhe in Pixeln, die eine Anwendung im Vollbildmodus einnehmen kann. Unterscheidet sich von screen.height, wenn feste Bildschirmelemente wie immer eingeblendete Taskleisten usw. einen Teil des Bildschirms oben oder unten einnehmen. Während `height` dann beispielsweise 768 liefert, gibt `availHeight` z.B. nur 712 aus, weil eine Taskleiste 56 Pixel Höhe einnimmt.

### Beispiel:

Anzeigebeispiel: So sieht's aus

    <html><head><title>Test</title>
    <script type="text/javascript">
    if (screen.availHeight != screen.height)
      alert("Sie sehen mehr von dieser Seite, wenn Sie die Taskleiste ausblenden");
    </script>
    </head><body>
    </body></html>

### Erläuterung:

Das Beispiel vergleicht die beiden Eigenschaften `screen.availHeight` und `screen.height`. Wenn beide nicht den gleichen Wert speichern, hat der Anwender vermutlich seine Taskleiste immer im Vordergrund. Das Beispiel gibt in diesem Fall einen entsprechenden Hinweis aus.

## availWidth

Speichert die maximal verfügbare Bildschirmbreite in Pixeln, die eine Anwendung im Vollbildmodus einnehmen kann. Unterscheidet sich von screen.width, wenn feste Bildschirmelemente wie immer eingeblendete Taskleisten usw. links oder rechts einen Teil des Bildschirms einnehmen. Während `width` dann beispielsweise 1024 liefert, gibt `availWidth` z.B. nur 940 aus, weil an einer Seite eine Taskleiste 84 Pixel Breite einnimmt.

### Beispiel:

Anzeigebeispiel: So sieht's aus

    <html><head><title>Test</title>
    <script type="text/javascript">
    if (screen.availWidth != screen.width)
      alert("Sie haben wohl seitlich eine Taskbar!");
    </script>
    </head><body>
    </body></html>

### Erläuterung:

Das Beispiel vergleicht die beiden Eigenschaften `screen.availWidth` und `screen.width`. Wenn beide nicht den gleichen Wert speichern, hat der Anwender vermutlich seine Taskleiste immer im Vordergrund. Das Beispiel gibt in diesem Fall einen entsprechenden Hinweis aus.

## colorDepth

Speichert die Anzahl Bits, die der Anwenderbildschirm zur Darstellung einer Farbe an jedem Pixelpunkt des Bildschirms verwendet. Ein Wert von 16 bedeutet beispielsweise: der Bildschirm kann 2 hoch 16, also 65536 Farben darstellen. Diese Eigenschaft hat dann einen Wert, wenn der Anwenderbildschirm intern eine Farbpalette benutzt. Andernfalls wird `undefined` (Netscape) oder `null` (Internet Explorer) gespeichert. Bei Netscape können Sie dann die Eigenschaft pixelDepth abfragen.

### Beispiel:

Anzeigebeispiel: So sieht's aus

    <html><head><title>Test</title>
    <script type="text/javascript">
    alert(Math.pow(2, screen.colorDepth));
    </script>
    </head><body>
    </body></html>

### Erläuterung:

Das Beispiel ermittelt die Anzahl Farben, die der Anwenderbildschirm darstellen kann, durch Anwendung der Math-Methode `pow()`. Mit `Math.pow(2,screen.colorDepth)` wird der Wert, den `screen.colorDepth` speichert, als Exponent zur Basis 2 benutzt. Das Ergebnis ist also 2 hoch `screen.colorDepth`.

## height

Speichert die absolut verfügbare Höhe des Anwenderbildschirms in Pixeln, besser bekannt als Höhe der Bildschirmauflösung. Typische Werte sind 480, 600 und 768.

### Beispiel:

Anzeigebeispiel: So sieht's aus

    <html><head><title>Test</title>
    <script type="text/javascript">
    if (screen.height >= 768) {
      window.location.href = "datei1.htm";
    } else {
      window.location.href = "datei2.htm";
    }
    </script>
    </head><body>
    </body></html>

### Erläuterung:

Das Beispiel fragt ab, ob die verfügbare Bildschirmhöhe größer oder gleich 768 ist. Wenn ja, wird automatisch `datei1.htm` geladen, wenn nicht (also wenn die Bildschirmhöhe kleiner ist), wird `datei2.htm` geladen.

## pixelDepth

Speichert die Farbtiefe des Anwenderbildschirms in Bit pro Pixel. Diese Eigenschaft hat dann einen Wert, wenn der Anwenderbildschirm intern eine Farbpalette benutzt. Andernfalls wird `undefined` (Netscape) oder `null` (Internet Explorer) gespeichert, und Sie müssen die Eigenschaft colorDepth abfragen.

### Beispiel:

Anzeigebeispiel: So sieht's aus

    <html><head><title>Test</title>
    <script type="text/javascript">
    if (screen.pixelDepth)
      alert(screen.pixelDepth);
    </script>
    </head><body>
    </body></html>

### Erläuterung:

Das Beispiel ermittelt, ob für `screen.pixelDepth` ein Wert verfügbar ist. Wenn ja, wird der Wert in einem Meldungsfenster ausgegeben.

## width

Speichert die absolut verfügbare Breite des Anwenderbildschirms in Pixeln, besser bekannt als Breite der Bildschirmauflösung. Typische Werte sind 640, 800 und 1024.

### Beispiel:

Anzeigebeispiel: So sieht's aus

    <html><head><title>Test</title>
    <script type="text/javascript">
    if (screen.width >= 1024) {
      window.location.href = "datei1.htm";
    } else {
      window.location.href = "datei2.htm";
    }
    </script>
    </head><body>
    </body></html>

### Erläuterung:

Das Beispiel fragt ab, ob die verfügbare Bildschirmbreite größer oder gleich 1024 ist. Wenn ja, wird automatisch `datei1.htm` geladen, wenn nicht (also wenn die Bildschirmbreite kleiner ist), wird `datei2.htm` geladen.

| String
| RegExp

© 2007 Impressum