Hallo syco753.

meine webseite soll auf die bildschirmgrösse(auflösung) reagieren können.

Da die Auflösung gänzlich unabhängig von der Größe des Viewports (Fensterinnenraumes) ist, solltest du besser die Dimensionen letzteres in dein Script einbeziehen.

Mit folgendem Script hab ich das versucht:

<script type="text/javascript">
if (screen.width == 800)
{
      <img border="0" src="grafik/logo800.jpg" width="771" height="82"></td>
}

Hier sollte wohl eigentlich die Grafik ins Dokument geschrieben werden, nicht? Die Fehlerkonsole eines Browsers hätte dir hier die Fehler gezeigt.

Und was ist mit dem schließenden Tabellentag da?

Kann jemand einem JS Unerfahrenen erklären wie ich das zu bewerkstelligen habe?

Am besten notierst du im Dokument erst einmal fest die kleinstmögliche Fassung deiner Grafik:

<img id="wechselgrafik" src="grafik/logo800.jpg" width="771" height="81" alt="Vergissmeinicht">

(Mit Hilfe der ID kannst du die Grafik später im Dokument verschieben wie es dir beliebt. Alternativ wäre der Zugriff auch einfach per document.http://de.selfhtml.org/javascript/objekte/images.htm@title=images-Knotenliste möglich.)

Nun kannst du beim Laden den Inhalt des src-Attributes dieser Grafik abhängig von z. B. der Breite des body-Elementes anpassen:

window.onload = function() {  
  
  if (document.[ref:self811;javascript/objekte/document.htm#get_element_by_id@title=getElementById]) {  
  
    var img = document.getElementById('wechselgrafik');  
    var bwidth = document.body.[ref:self811;javascript/objekte/all.htm#offset_width@title=offsetWidth];  
  
    if (bwidth > 800) {  
  
      img.[ref:self811;javascript/objekte/htmlelemente.htm#img@title=src] = "grafik/logo1024.jpg";  
  
    } else if (bwidth > 1000) {  
  
      img.src = "grafik/logo1280.jpg";  
    }  
  
  }  
};

Zum besseren Verständnis solltest du den im Code platzierten Links folgen.

Nebenbei: deine Grafik möchte nicht zufällig eigentlich eine Hintergrundgrafik sein, oder?

Einen schönen Montag noch.

Gruß, Mathias

Bildschirmauflösung width = 800   -> lade: logo800.jpg
Bildschirmauflösung width = 1024   -> lade: logo1024.jpg
Bildschirmauflösung width = 1280   -> lade: logo1280.jpg
Bildschirmauflösung width = unbekannt oder nicht gleich oben -> lade logo1024.jpg

Das heißt, ich erhalte trotz verfügbarer 1.920 Pixel weniger als 1.280, nämlich nur 1.024, was dennoch für eine Browserfensterbreite von 900 Pixel zu viel ist. Schlecht. Du interessierst dich eigentlich gar nicht für die Auflösung meines Monitors, sondern für die Innengröße meines Browserfensters, denn mehr Platz steht deiner Site nicht zur Verfügung. Mein Browser läuft nur hier im Forum in voller Pracht, weil ich hier die Textbreite selbst einstellen kann. Auf anderen Seiten ohne Höchstbreite sind 100 und mehr Zeichen pro Zeile nicht unbedingt gut lesbar.

Wie es um derartige Optimierungen bestellt ist, erklärt dir molily im Weblog, das auch eine informative Statistik bietet. Dort findest du auch Verweise auf „fluide“ Layouts, die sich den Gegebenheiten anpassen. Weitere Layout-Sammlungen: float, 2 Spalten, 3 Spalten, volle Höhe, CSS-Galerien allgemein.

Kann jemand einem JS Unerfahrenen erklären wie ich das zu bewerkstelligen habe?

Mit JavaScript kommst du nicht unbedingt gut weiter. Wäre es nicht besser, kein starres, sondern ein flexibles Layout einzusetzen? Machen pixelgenaue Hintergrundbilder es erforderlich, feste Breiten vorzugeben? Besser, du definierst nur eine Maximalbreite, um den Inhalt leserlich zu halten und verlässt dich darauf, dass der Browser den Text korrekt umbricht. Grase also zunächst die angegebenen Verweise ab und versuche, ein dir genehmes Layout nach deinen eigenen Vorstellungen umzugestalten.

Solltest du dennoch ins Verderben laufen wollen, kannst du dir ansehen, wie man die <http://de.selfhtml.org/javascript/beispiele/fensterueberwachen.htm#quelltext@title=Fensterbreite mit JavaScript> ermittelt.

Roland