Thomas Häber: Netscape-Problem beim dynamischen Ändern eine Textinhalts.

SELF-Forum

Netscape-Problem beim dynamischen Ändern eine Textinhalts.

Thomas Häber
– Informationen zu den Bewertungsregeln

Tach,

Habe diesen Script geschrieben:

<html>
<!-- Copyrights by Thomas Häber webmaster@haeber.de //-->
<head>
<title>Startseite mit dynamischen Inhalt</title>
<style type="text/css">
<!--
a:hover {color:"#FFFFFF";}
a       {text-decoration:"none";}
all.Zeugs { font-family:"Century Gothic,Arial"; font-size:"36pt"; color:"#000000"; }

-->
</style>

<script language="JavaScript" type="text/javascript">
<!--
function Nothing()
{
if(document.all)
   document.all.Microsoft.innerHTML = "<--<br>Klicken Sie auf der linken Seite den gewünschten Verweis an.";
else if(document.layers)
  {
   document.Netscape.document.open();
   Gesamt = '<span class="Zeugs")><--<br>Klicken Sie auf der linken Seite den gewünschten Verweis an.</span>';
   document.Netscape.document.write(Gesamt);
   document.Netscape.document.close();
  }
}

function Touristik()
{
if(document.all)
   document.all.Microsoft.innerHTML = "Hier informieren Sie sich über die Touristikangebote der UZE GmbH.";
else if(document.layers)
  {
   document.Netscape.document.open();
   Gesamt = '<span class="Zeugs")>Hier informieren Sie sich über die Touristikangebote der UZE GmbH.</span>';
   document.Netscape.document.write(Gesamt);
   document.Netscape.document.close();
  }
}

function Export()
{
if(document.all)
   document.all.Microsoft.innerHTML = "Hier informieren Sie sich über die Import- und Exportgeschäfte sowie die Luftfracht der UZE GmbH.";
else if(document.layers)
  {
   document.Netscape.document.open();
   Gesamt = '<span class="Zeugs")>Hier informieren Sie sich über die Import- und Exportgeschäfte sowie die Luftfracht der UZE GmbH.</span>';
   document.Netscape.document.write(Gesamt);
   document.Netscape.document.close();
  }
}

function Diverses()
{
if(document.all)
   document.all.Microsoft.innerHTML = "Hier informieren Sie sich über Diverses.";
else if(document.layers)
  {
   document.Netscape.document.open();
   Gesamt = '<span class="Zeugs")>Hier informieren Sie sich über Diverses.</span>';
   document.Netscape.document.write(Gesamt);
   document.Netscape.document.close();
  }
}
// -->
</script>
</head>

<body onload="Nothing();" bgcolor="#6666FF" text="#000000" link="#000000" alink="#000000" vlink="#000000">
<table style="font-family:Arial,Lucida Sans;font-size:13px;font-color:#000000;" bordercolor="#FFFF00" align="center" width="550" height="360" cellspacing="0" cellpadding="0" border="1">
<tr height="120">
<td align="center" width="250"><a href="index2.html" onMouseOver="Touristik();" onMouseOut="Nothing();">&#149 Touristik</a></td>
<td align="center" width="300" rowspan="3">

<div id="Microsoft" class="Zeugs">
</div>

<layer id="Netscape">
</layer>
<br>

</td>
</tr>

<tr height="120">
<td align="center" width="250"><a href="index3.html" onMouseOver="Export();" onMouseOut="Nothing();">&#149 Import, Export und Luftfracht</a></td>
</tr>

<tr height="120">
<td align="center" width="250"><a href="index4.html" onMouseOver="Diverses();" onMouseOut="Nothing();">&#149 Diverses</a></td>
</tr>
</table>
</body>
</html>

So, nun funktioniert das aber nicht unter Netscape, liegt es am Netscape Preview Release 2 oder generell an Netscape - MS Internet Explorer macht hier keine Probleme.
Wo liegt also der Fehler.
Achso bitte probiert es aus, sonst checkt man nämlich gar nicht worum es geht.

MfG
Thomas

Beitrag melden
–
Informationen zu den Bewertungsregeln

  1. Netscape-Problem beim dynamischen Ändern eine Textinhalts.

    Utz
    – Informationen zu den Bewertungsregeln

    Hi Thomas,

    Achso bitte probiert es aus, sonst checkt man nämlich gar nicht worum es geht.

    <modus class="angeber">
    Braucht man nicht, ist auch so schon klar wo der Fehler liegt.
    </modus>

    document.all ist proprietär von IE 4 und 5, document.layers von NS 4.x; NS 6 versteht keines davon.
    Statt dessen verlangt er eine Syntax nach dem DOM (Spec unter http://w3.org/). Mach mal eine Archivsuche mit dem Stichwort getElementByID (oder getElementsByID - mein Gedächtnis!), da findest Du schon etliches zu dem Thema.

    Grüße,

    Utz

    Beitrag melden
    –
    Informationen zu den Bewertungsregeln

    1. Netscape-Problem beim dynamischen Ändern eine Textinhalts.

      Thomas Häber
      – Informationen zu den Bewertungsregeln

      Mh,

      Ein Beispiel wäre aber schöner als mich in W3C suchen zu lassen.

      MfG
      Thomas

      Beitrag melden
      –
      Informationen zu den Bewertungsregeln

      1. (ZU DIESEM FORUM) sonst noch was

        Weihnachtsmann
        – Informationen zu den Bewertungsregeln

        Mh,

        Ein Beispiel wäre aber schöner als mich in W3C suchen zu lassen.

        MfG
        Thomas

        Ja klar,

        Schreib doch einfach mal ne Wunschliste, vielleicht darf's ja sonst noch was sein bei der Gelegenheit.

        gruesse

        Beitrag melden
        –
        Informationen zu den Bewertungsregeln

        1. (ZU DIESEM FORUM) sonst noch was

          Thomas Häber
          – Informationen zu den Bewertungsregeln

          Eh du Wehnachtsmann,

          Zufälligerweise hab ich hier schon von aufgeschlosseneren Leuten Hilfe erhalten, und extrem schlimmerweise trifft das auf dich nicht zu.

          Zu allen netten Typen noch einmal die Bitte:

          Wie geht das nun unter Netscape, im tollen W3C stehen nur 28seitige englische Texte zu diesem Thema, welche mir auf keine Weise helfen.

          MfG
          Thomas

          Beitrag melden
          –
          Informationen zu den Bewertungsregeln

          1. (ZU DIESEM FORUM) sonst noch was

            kerki
            – Informationen zu den Bewertungsregeln

            HalliHallo Ihr beiden!

            Kein Grund zur Panik!

            Eigentlich wäre ein netter Hinweis des Weihnachtsmanns angebracht gewesen, in dem er dir mitteilt, dass du Utz ein wenig missverstanden hast.

            Er hatte dich nämlich gar nicht nach W3C verwiesen, sondern vielmehr ins Forumsarchiv und das sogar mit Stichwort, also :

            http://www.teamone.de/cgi-local/sfasuch.pl?suchausdruck=getElementByID&feld=alle&hits=alle

            Von Javascript habe ich herzlich wenig Ahnung, aber die Antworten scheinen absolut mit deinem Problem zu tun zu haben.

            Ist zwar auch viel zu lesen, sollte aber zumutbar sein. .-)

            Gruß,
            kerki

            Beitrag melden
            –
            Informationen zu den Bewertungsregeln

  2. Netscape-Problem beim dynamischen Ändern eine Textinhalts.

    Carsten
    – Informationen zu den Bewertungsregeln

    Hallo Thomas,

    Habe diesen Script geschrieben:

    Oh mann.

    So, nun funktioniert das aber nicht unter Netscape, liegt es am Netscape
    Preview Release 2 oder generell an Netscape

    Ähm, dir ist klar, dass Netscape bis 4.7 und Netscape ab 5 (also die
    Pre-Releases und die Mozilla Milestones) nix aber auch gar nix miteinander
    zu tun haben, was das verhalten bei DHTML betrifft ?

    • MS Internet Explorer macht hier keine Probleme.

    naja, wenn du die <style>'s so schreibst, dass sie funktionieren, funktioniert
    die Seite auch im IE nicht mehr so richtig toll. (36pt muss aber auch nicht
    sein ;-)

    Wo liegt also der Fehler.

    Ich geh mal davon aus, dass du das ganze für normale Internet-Benutzer machen
    möchtest - also IE4/5 und NN4.x. Der IE Teil klappt ja schon mal.
    Der NN positioniert Layer aber absolut, die variable Text-Ausgabe 'klebt' immer
    in der linken oberen Ecke. Relative Positionierung plus document.write in
    <div> Bereiche klappt nicht so recht, also muss man den Layer an die richtige
    Stelle schieben.

    So funktioniert es:

    <html>
    <!-- Copyrights by Thomas Häber webmaster@haeber.de //-->
    <head>
    <title>Startseite mit dynamischen Inhalt</title>
    <style type="text/css">
    <!--
    a:hover {color:"#FFFFFF";}
    a       {text-decoration:"none";}
    .Zeugs { font-family:"Century Gothic",Arial; font-size:20pt; color:#000000; text-align:center; }
    td  {font-family:Arial,"Lucida Sans"; font-size:13pt; color:#000000; }
    -->
    </style>

    <script language="JavaScript" type="text/javascript">
    <!--
    function TextSetzen(welche)
    {
      switch (welche)
      {
      default:
      case "Nothing":
        text="<-- Klicken Sie auf der linken Seite den gewünschten Verweis an.";
        break;
      case "Touristik":
        text="Hier informieren Sie sich über die Touristikangebote der UZE GmbH.";
        break;
      case "Export":
        text="Hier informieren Sie sich über die Import- und Exportgeschäfte sowie die Luftfracht der UZE GmbH.";
        break;
      case "Diverses":
        text="Hier informieren Sie sich über Diverses."
        break;
      }
      TextAnzeigen(text);
    }

    function TextAnzeigen(text)
    {
      if(document.all)
        document.all.Microsoft.innerHTML = text;
      else if(document.layers)
      {
        // anti Flacker, da die (Y)Position erst nach dem
        // document.write() verändert werden kann
        document.Netscape.visibility="hidden";

    // Text zusammenbauen und ausgeben
        document.Netscape.document.open();
        Gesamt = '<span class="Zeugs")>'+text+'</span>';
        document.Netscape.document.write(Gesamt);
        document.Netscape.document.close();

    // relative Positionierte <div>'s funktionieren nicht richtig,
        // aber immerhin lässt sich die Position eines relativen <div>
        // ermitteln und an das absolute <layer> zuweisen
        document.Netscape.pageX=document.Microsoft.pageX+5;
        // Horizontal positionieren und zentrieren
        document.Netscape.pageY=document.Microsoft.pageY-document.Netscape.clip.height/2;

    // Ergebnis sichtbar machen
        document.Netscape.visibility="show";
      }
    }
    // -->
    </script>
    </head>
    <body onload="TextSetzen('Nothing');" bgcolor="#6666FF" text="#000000" link="#000000" alink="#000000" vlink="#000000">
    <table bordercolor="#FFFF00" align="center" width="550" height="360" cellspacing="0" cellpadding="0" border="1">
    <tr height="120">
    <td align="center" width="250"><a href="index2.html" onMouseOver="TextSetzen('Touristik');" onMouseOut="TextSetzen();">&#149; Touristik</a></td>
    <td width="300" rowspan="3">

    <layer name="Netscape" width=290></layer>

    <div id="Microsoft" class="Zeugs" style="position:relative; left:0; top:0;" ></div>

    </td></tr><tr height="120">
    <td align="center" width="250"><a href="index3.html" onMouseOver="TextSetzen('Export');" onMouseOut="TextSetzen();">&#149; Import, Export und Luftfracht</a></td></tr><tr height="120">
    <td align="center" width="250"><a href="index4.html" onMouseOver="TextSetzen('Diverses');" onMouseOut="TextSetzen();">&#149; Diverses</a></td>
    </tr>
    </table>
    </body>
    </html>

    Änderungen:
    <style> korrigiert, das hat ja noch nicht mal der IE angezeigt *fg*

    4 mal den gleichen Code zu einer Funktion zusammengefasst, sonst kriegt man
    ja 'nen Rappel beim rumprobieren.

    im Script-Teil alle </ durch </ ersetzt. (Korinthenkackerei, ist nur ein muss,
    wenn in einem String "</script>" vorkommt)

    Codeteil für Netscape-Ausgabe angepasst: siehe Kommentare.

    Immer noch drin ist der bekannte Netscape resize-bug. (Verstell mal die
    Fenstergrösse... :( ... einmal Reload drücken -> wieder ok. Steht irgendwo
    im Archiv auch ein Abhilfe-Script zu.)

    Alternative Realisierung mit vier <div> von den immer nur eins
    sichbar ist:

    <html><head>
    <style type="text/css">
    <!--
    a:hover {color:"#FFFFFF";}
    a       {text-decoration:"none";}
    .Zeugs  { font-family:"Century Gothic",Arial; font-size:20pt; color:#000000; text-align:center; position:absolute; left:0; top:0; width:290; visibility:hidden; }
    .MZeugs { font-family:"Century Gothic",Arial; font-size:20pt; color:#000000; text-align:center; position:relative; left:0; top:0; width:290; }
    td  {font-family:Arial,"Lucida Sans"; font-size:13pt; color:#000000; }
    -->
    </style>
    <script><!--

    var letzter;

    function TextSetzen(text)
    {
      if(!text)
        text="Nothing";

    if(document.all)
        document.all.Microsaft.innerHTML = document.all[text].innerHTML ;
      else if(document.layers)
      {
        if(letzter)
          document.layers[letzter].visibility="hide";
        letzter=text;

    // Referenzposition ist der relativ positionierte Layer
        // Dahin wird jetzt der Layer, der angezeigt werden soll
        // verschoben
        document.layers[text].pageX=document.Microsaft.pageX+5;
        // in Y-Richtung muss zusätzlich noch zentriert werden.
        // dazu wird um die Hälfte des Clip-Bereiches nach oben verschoben.
        document.layers[text].pageY=document.Microsaft.pageY-document.layers[text].clip.height/2;

    document.layers[text].visibility="show";
      }
    }
    // -->
    </script>
    </head>
    <body onload="TextSetzen();" bgcolor="#6666FF" text="#000000" link="#000000" alink="#000000" vlink="#000000">
    <table bordercolor="#FFFF00" align="center" width="550" height="360" cellspacing="0" cellpadding="0" border="1">
    <tr height="120"><td align="center" width="250"><a href="index2.html" onMouseOver="TextSetzen('Touristik');" onMouseOut="TextSetzen();">&amp:#149; Touristik</a></td>
    <td align="center" width="300" rowspan="3">

    <div id="Microsaft" class="MZeugs"></div>
    <div id="Nothing" class="Zeugs"><-- Klicken Sie auf der linken Seite den gewünschten Verweis an.</div>
    <div id="Export" class="Zeugs">Hier informieren Sie sich über die Import- und Exportgeschäfte sowie die Luftfracht der UZE GmbH.</div>
    <div id="Diverses" class="Zeugs">Hier informieren Sie sich über Diverses.</div>
    <div id="Touristik" class="Zeugs">Hier informieren Sie sich über die Touristikangebote der UZE GmbH.</div></td></tr>

    <tr height="120"><td align="center" width="250"><a href="index3.html" onMouseOver="TextSetzen('Export');" onMouseOut="TextSetzen();">&#149; Import, Export und Luftfracht</a></td></tr>
    <tr height="120"><td align="center" width="250"><a href="index4.html" onMouseOver="TextSetzen('Diverses');" onMouseOut="TextSetzen();">&#149; Diverses</a></td></tr>
    </table></body></html>

    Vorteil: Du hast keinen (Text)Inhalt mehr im Script drinstehen, etwas kürzer.

    So, jetzt habe ich aber genug Netscape DHTML für heute gelernt.
    (Getestet mit NN4.73/IE5.0, keine Garantie das es woanders läuft.)

    Gruss,
    Carsten

    Beitrag melden
    –
    Informationen zu den Bewertungsregeln