Manuel Schölling: (Un-)Sichtbar machen für alle Browser

Hallo,
ich habe ein Problem, dass bestimmt schon viele und oft hatten:

Wie mache ich einen Bereich (Text, Image oder Form-Feld) via javascript sichtbar/unsichtbar. Und das für jeden Browser.

Hat da irgendjemand ein Patentrezept???

Tschö
Manuel

  1. Hallo,
    ich habe ein Problem, dass bestimmt schon viele und oft hatten:

    Wie mache ich einen Bereich (Text, Image oder Form-Feld) via javascript sichtbar/unsichtbar. Und das für jeden Browser.

    Hat da irgendjemand ein Patentrezept???

    Tschö
    Manuel

    Hi Manuel!

    Mein Beispiel funktioniert auf jeden Fall für die etwas neueren Generationen von IE und Netscape. Definiere für den Bereich, den Du (un-)sichtbar machen willst folgenden Frame:

    <iframe height=yyy width=xxx name="ghost" frameborder=0 scrolling="no" src="inhalt.html"></iframe>

    Hat die Datei 'inhalt.html' die gleiche Hintergrundfarbe wie die Eltern-Datei, die den Frame erzeugt, dann erkennt man nicht, dass hier eine zweite Datei eingebunden wurde. Nun kannst Du mit Hilfe der HTML-Elementobjekte den Inhalt des Frames beliebig verändern, indem Du einfach eine neue Datei einfügst:

    <script language="JavaScript">
    document.getElementById("ghost").src="neuerInhalt.html";
    </script>

    'neuerInhalt.html' sollte dann eine HTML-Datei sein, die einfach nur die Hintergrundfarbe der Eltern-Datei hat. Der alte Inhalt wird dadurch quasi 'übermalt'. Sollen die Elemente wieder erscheinen, dann lade einfach die ursprüngliche Datei wieder in das Frame.

    Vielleicht gibts auch einfachere Lösungen, aber diese funktioniert auf jeden Fall  ;o)

    Gruß, Tobias

  2. Wie mache ich einen Bereich (Text, Image oder Form-Feld) via javascript sichtbar/unsichtbar. Und das für jeden Browser.

    Hat da irgendjemand ein Patentrezept???

    Wie wäre es mit einem <div>-Bereich, den du mit
    divid.style.visibility=false;
    versteckst? Alternativ könntest du den clip-Bereich für den div so einstellen, dass nix vom div-Bereich angezeigt wird.

    1. Wie wäre es mit einem <div>-Bereich, den du mit
      divid.style.visibility=false;
      versteckst? Alternativ könntest du den clip-Bereich für den div so einstellen, dass nix vom div-Bereich angezeigt wird.

      Ja, das wäre ja garnicht schlecht, aber die javascript ansteuerung ist bei jedem browser anders oder?

      1. Hallo,

        Ja, das wäre ja garnicht schlecht, aber die javascript ansteuerung ist bei jedem browser anders oder?

        Jein. Es gibt 3 Modelle (die auch alle drei diese Möglichkeit bieten):

        * NN4-Modell (veraltet)

        Du setzt den Style via document.layers['divid'].visibility = 'hide';
        (bzw. 'show' zum Wiederanzeigen)

        * IE4-Modell (veraltet)

        Du setzt den Style via document.all['divid'].style.visibility = 'hidden';
        (bzw. 'visible' zum Wiederanzeigen)

        * DOM-Modell (Standard)

        Du setzt den Style via document.getElementById('divid').style.visiblity = 'hidden';
        (bzw. 'visibile' zum Wiederanzeigen)

        Das DOM-Modell ist die Zukunft und wird von IE5+, Mozilla, Netscape6+, Konqueror, Opera und weiteren unterstützt.

        Damit Du diese Modelle trennen kannst, kannst Du folgende Abfragen verwenden:

        if (document.getElementById) {
          // DOM
        } else if (document.all) {
          // IE4
        } else if (document.layers) {
          // NN4
        } else {
          // dieser Browser unterstützt keines dieser DHTML-Modelle
        }

        Grüße,

        Christian

        1. Hallo,

          * DOM-Modell (Standard)

          Du setzt den Style via document.getElementById('divid').style.visiblity = 'hidden';
          (bzw. 'visibile' zum Wiederanzeigen)

          ^
                         das soll visible heißen - grrr.

          Das DOM-Modell ist die Zukunft und wird von IE5+, Mozilla, Netscape6+, Konqueror, Opera und weiteren unterstützt.

          Damit Du diese Modelle trennen kannst, kannst Du folgende Abfragen verwenden:

          if (document.getElementById) {
            // DOM
          } else if (document.all) {
            // IE4
          } else if (document.layers) {
            // NN4
          } else {
            // dieser Browser unterstützt keines dieser DHTML-Modelle
          }

          Grüße,

          Christian

          1. Alles Klar,
            Danke an alle