MKay: Warum funktioniert innerHTML nicht?

SELF-Forum

Warum funktioniert innerHTML nicht?

MKay
– Informationen zu den Bewertungsregeln

Hallo, ich versuche folgendes zu bewerkstelligen(zwischen <head>):

<script type="text/javascript">
if(screen.width <= 1280)
{
document.all.STYLA.innerHTML="<style type='text/css'><!-- body {background-attachment: fixed; background-image: url(images/back.jpg); background-repeat: repeat; background-position: -200px -100px;}--></style>}"
else
{
document.all.STYLA.innerHTML="<style type='text/css'><!-- body {background-attachment: fixed; background-image: url(images/back2.jpg); background-repeat: repeat; background-position: -200px -100px;}--></style>}"
}
</script>
<div id="STYLA"></div>
</head>

Das ganze soll 2 verschiedene Hintergrundbilder für die Seite laden, je nach Auflösung, aber es klappt einfach nicht :(

Danke für eure Hilfe im Voraus!

Beitrag melden
–
Informationen zu den Bewertungsregeln

  1. Warum funktioniert innerHTML nicht?

    JürgenB Homepage des Autors
    – Informationen zu den Bewertungsregeln

    Hallo MKay,

    vergiss ganz schnell wieder, was du da gepostet hast. "all" ist IE-only und nicht alle HTML-Elemente dürfen überall stehen. Ebenso ist die Abfrage der Bildschirmgröße fast immer Unfug. Du willst die Größe des Browserfensters wissen. Such dazu mal nach Viewport. Zu dieser Thematik liest du aber am besten diesen Artikel.

    Zu deinem Problem: Du kannst per Javascript im onload-Eventhandler der Seite einfach den Hintergrund des Bodys ändern:

    document.body.style.backgroundImage = "url( ... )";

    Oder nimm doch einfach einen genügend großen Hintergrund mittig auf der Seite. Wenn die Seite kleiner ist, sieht man eben nur die Mitte.

    Gruß, Jürgen

    Beitrag melden
    –
    Informationen zu den Bewertungsregeln

    1. Warum funktioniert innerHTML nicht?

      MKay
      – Informationen zu den Bewertungsregeln

      Hallo MKay,

      vergiss ganz schnell wieder, was du da gepostet hast. "all" ist IE-only und nicht alle HTML-Elemente dürfen überall stehen. Ebenso ist die Abfrage der Bildschirmgröße fast immer Unfug. Du willst die Größe des Browserfensters wissen. Such dazu mal nach Viewport. Zu dieser Thematik liest du aber am besten diesen Artikel.

      Zu deinem Problem: Du kannst per Javascript im onload-Eventhandler der Seite einfach den Hintergrund des Bodys ändern:

      document.body.style.backgroundImage = "url( ... )";

      
>   
> Oder nimm doch einfach einen genügend großen Hintergrund mittig auf der Seite. Wenn die Seite kleiner ist, sieht man eben nur die Mitte.  
>   
> Gruß, Jürgen  
>   
  
Hallo Jürge, bitte keine Moralpredigten, ich wusste dass sowas bei Auflösungsabfragen kommt, das ist schon gerechtfertigt so, und soll auch nicht die genaue Browsergröße abfragen sondern tatsächlich die Auflösung ;-)  
  
document.body.style.backgroundImage = "url(images/back.jpg)";  
  
Funktioniert das zwischen den Script-Tags auch oder nur beim body tag?  
Weil irgendwie muss ich ja noch das if einbauen.
      Beitrag melden
      –
      Informationen zu den Bewertungsregeln

      1. Warum funktioniert innerHTML nicht?

        JürgenB Homepage des Autors
        – Informationen zu den Bewertungsregeln

        Hallo MKay,

        Scripte müssen immer zwischen Script-Tags stehen. Script-Tags sind am besten im Head (oder in einer externen Javascript-Datei) untergebracht. Für dich heißt das, dass du im Head einen Scriptbereich anlegst. In diesen legst du eine Funktion, die den Hintergrund ändert. Diese Funktion rufst du dann im Onload-Eventhandler der Seite auf.

        Gruß, Jürgen

        PS Ich finde es übrigens schon ganz schön dreist, wenn jemand, der noch nicht mal weiß, wie man Scripte in eine HTML-Seite einbindet, sich über das Wissen des Autors des verlinkten Artikels hinwegsetzt.

        Beitrag melden
        –
        Informationen zu den Bewertungsregeln

      2. Warum funktioniert innerHTML nicht?

        Cybaer Homepage des Autors
        – Informationen zu den Bewertungsregeln

        Hi,

        Hallo Jürge, bitte keine Moralpredigten, ich wusste dass sowas bei Auflösungsabfragen kommt, das ist schon gerechtfertigt so,

        Das mag sein, aber der Rest ist halt auch katastrophal falsch.

        • all ist absolut obsolet. Stattdessen: getElementById() (wobei hier ja beides nicht notwendig ist).
        • DIV hat im HEAD nichts verloren.
        • STYLE hat im DIV nichts verloren.

        Und wenn jemand so viele (JS-, HTML- & CSS-)Fehler auf so wenig Platz macht, dann ist die Frage auch berechtigt, ob er sich bei der Abfrage der Bildchirmgröße etwas gedacht hat (und wenn ja: ob das auch sinnvoll war).

        Gruß, Cybaer

        --
        Man muß viel gelernt haben, um über das, was man nicht weiß, fragen zu können.
        (Jean-Jacques Rousseau, Philosoph u. Schriftsteller)
        Beitrag melden
        –
        Informationen zu den Bewertungsregeln

      3. Warum funktioniert innerHTML nicht?

        Cybaer Homepage des Autors
        – Informationen zu den Bewertungsregeln

        Hi,

        Funktioniert das zwischen den Script-Tags auch oder nur beim body tag?
        Weil irgendwie muss ich ja noch das if einbauen.

        Z.B. in einem SCRIPT-Element irgendwo (und sei es direkt) hinter dem BODY-Start-Tag.

        Denn auf Elemente kann man erst zugreifen, wenn sie bereits existieren (das gilt übrigens auch für korrekt plazierte DIV-Elemente).

        Wenn Du einen Stil vorher hinzufügen möchtest: addStyle()

        Das funktioniert dann auch im HEAD ...

        Gruß, Cybaer

        --
        Man muß viel gelernt haben, um über das, was man nicht weiß, fragen zu können.
        (Jean-Jacques Rousseau, Philosoph u. Schriftsteller)
        Beitrag melden
        –
        Informationen zu den Bewertungsregeln