Andreas: Browser-Erkennung mit Objektprüfung: style.cursor="hand"

Hallo!

Folgender Code:

if(document.getElementById)
 {
 ...
 beliebiges[i].style.cursor = "pointer";
 ...
 }

Bei den meisten Browsern funktuninert das einwandfrei. IE5 (und vielleicht auch andere Browser) benötigen aber die Anweisung

beliebiges[i].style.cursor = "hand";

Wie ich beim Durchforstend des Forums schnell gemerkt habe, ist eine Fallunterscheidung durch userAgent (zu recht) ziemlich verpönt. ;-) Mit welcher Objektprüfung könnte ich denn den IE5
(oder optimalerweise: jeden Browser, der style.cursor = "pointer"; nicht versteht)
ansprechen?

Beste Grüße
Andreas

  1. Hallo Andreas!
    Ich bin zwar nicht 100% sicher, dass es funktioniert, aber hast du dir schon mal try..catch angeschaut?
    Das wäre, wie ich das probieren würde.

    Viel Spass,
    Richard

    1. Hallo Richard!

      Ich bin zwar nicht 100% sicher, dass es funktioniert, aber hast du dir schon mal try..catch angeschaut?

      Danke für den Tipp. Ich habe noch nie mit try..catch gearbeitet, aber ich werde es mal probieren. Weiß vielleicht jemand genauer, wie ich es anwenden kann?

      Besten Dank
      Andreas

    2. Hallo nochmal!

      Ich habe jetzt Folgendes probiert:

      try
         { document.getElementById(mblock).style.cursor = "pointer";}
       catch (e)
         { alert("error"); return; }

      Leider funktioniert es nicht. :(  IE5 gibt die Fehlermeldung unter catch nicht aus. Weiß irgendjemand, woran das liegen könnte?

      Beste Grüße
      Andreas

      1. Hallo,

        Ich habe jetzt Folgendes probiert:

        try
           { document.getElementById(mblock).style.cursor = "pointer";}
         catch (e)
           { alert("error"); return; }

        Leider funktioniert es nicht. :(  IE5 gibt die Fehlermeldung unter catch nicht aus.

        Kann er auch nicht, weil kein Fehler auftritt. Die Eigenschaft [Element].style.cursor ist ja vorhanden und kann einen Wert zugewiesen bekommen. Auch
        document.getElementById(mblock).style.cursor = "MaxIstDoof";
        würde keinen Fehler erzeugen.

        Du kannst der cursor-Eigenschaft nacheinander die Werte "pointer" und "hand" zuweisen. Browser, die CSS {cursor:hand;} nicht kennen, sollten diese Zuweisung ignorieren.

        document.getElementById(mblock).style.cursor = "pointer";
        document.getElementById(mblock).style.cursor = "hand";

        Oder gleich im CSS des entsprechenden Elements:

        {... cursor:pointer; cursor:hand; ... }

        viele Grüße

        Axel

        1. Hallo Axel,

          Kann er auch nicht, weil kein Fehler auftritt. Die Eigenschaft [Element].style.cursor ist ja vorhanden und kann einen Wert zugewiesen bekommen. Auch
          document.getElementById(mblock).style.cursor = "MaxIstDoof";
          würde keinen Fehler erzeugen.

          Doch, ich habe mich getäuscht. Es funktioniert; mein Fehler lag weiter oben im Code. Ich habe jetzt aber ein neues Problem entdeckt (siehe meinen Berichtigungs-Beitrag)...

          Du kannst der cursor-Eigenschaft nacheinander die Werte "pointer" und "hand" zuweisen. Browser, die CSS {cursor:hand;} nicht kennen, sollten diese Zuweisung ignorieren.

          document.getElementById(mblock).style.cursor = "pointer";
          document.getElementById(mblock).style.cursor = "hand";

          Habe ich auch schon probiert, funktioniert leider nicht.

          Oder gleich im CSS des entsprechenden Elements:

          {... cursor:pointer; cursor:hand; ... }

          Die Cursoranzeige soll in meinem Fall dynamisch sein, also leider: auch das geht nicht.

          Beste Grüße
          Andreas

          1. Hallo,

            Kann er auch nicht, weil kein Fehler auftritt. Die Eigenschaft [Element].style.cursor ist ja vorhanden und kann einen Wert zugewiesen bekommen. Auch
            document.getElementById(mblock).style.cursor = "MaxIstDoof";
            würde keinen Fehler erzeugen.

            Doch, ich habe mich getäuscht. Es funktioniert; mein Fehler lag weiter oben im Code. Ich habe jetzt aber ein neues Problem entdeckt (siehe meinen Berichtigungs-Beitrag)...

            Nein eine Anweisung [Element].style.cursor = "irgendwas" kann _nie_ einen Fehler verursachen. Ein Fehler würde verursacht, wenn es [Element] nicht gibt.

            <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN"
                    "http://www.w3.org/TR/html4/strict.dtd">
            <html>
            <head>
            <title>Cursor Hand</title>
            <meta http-equiv="content-type" content="text/html; charset=ISO-8859-1">
            <script type="text/javascript">
            <!--
            function machHandCursor(){
             try {
              document.getElementById("mblock").style.cursor = "MaxIstDoof";
              document.getElementById("mblock").style.cursor = "pointer";
              document.getElementById("mblock").style.cursor = "hand";
              //document.getElementById("gibtsnicht").style.cursor = "hand";
             } catch (e) {
              alert(e.toString()); return;
             }
            }
            //-->
            </script>
            </head>
            <body onload="machHandCursor();">
            <h1 id="mblock">Test</h1>
            </body>
            </html>

            Wenn Du die Kommentarzeichen wegnimmst, _dann_ wird der catch-Block erreicht.

            Du kannst der cursor-Eigenschaft nacheinander die Werte "pointer" und "hand" zuweisen. Browser, die CSS {cursor:hand;} nicht kennen, sollten diese Zuweisung ignorieren.

            document.getElementById(mblock).style.cursor = "pointer";
            document.getElementById(mblock).style.cursor = "hand";

            Habe ich auch schon probiert, funktioniert leider nicht.

            Doch. Das obige beispiel zeigt sowohl im IE, als auch im Mozilla einen Hand-Cursor

            Oder gleich im CSS des entsprechenden Elements:

            {... cursor:pointer; cursor:hand; ... }

            Die Cursoranzeige soll in meinem Fall dynamisch sein, also leider: auch das geht nicht.

            Doch, auch das würde gehen. Du kannst doch die CSS-Klassen dynamisch austauschen.

            <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN"
                    "http://www.w3.org/TR/html4/strict.dtd">
            <html>
            <head>
            <title>Cursor Hand</title>
            <meta http-equiv="content-type" content="text/html; charset=ISO-8859-1">
            <style type="text/css">
            <!--
            .handcursor {
              cursor:pointer;
              cursor:hand;
            }
            -->
            </style>
            <script type="text/javascript">
            <!--
            function machHandCursor(){
             try {
              document.getElementById("mblock").className = "handcursor";
             } catch (e) {
              alert(e.toString()); return;
             }
            }
            //-->
            </script>
            </head>
            <body>
            <h1 id="mblock">Test</h1>
            <button onclick="machHandCursor();">Handcursor</button>
            </body>
            </html>

            viele Grüße

            Axel

            1. Nein eine Anweisung [Element].style.cursor = "irgendwas" kann _nie_ einen Fehler verursachen. Ein Fehler würde verursacht, wenn es [Element] nicht gibt.

              Ich muss dich korrigieren: IE 5.0 liefert auch bei
                document.getElementById(mblock).style.cursor = "MaxIstDoof";
              die Fehlermeldung: "[Object Error]". Netscape (und wahrscheinlich auch neuere Versionen des IE) allerdings nicht.

              (Die Anführungsstriche von mblock habe ich entfernt, weil damit überall Fehlermeldungen erzeugt werden)

              Du kannst der cursor-Eigenschaft nacheinander die Werte "pointer" und "hand" zuweisen. Browser, die CSS {cursor:hand;} nicht kennen, sollten diese Zuweisung ignorieren.

              document.getElementById(mblock).style.cursor = "pointer";
              document.getElementById(mblock).style.cursor = "hand";

              Habe ich auch schon probiert, funktioniert leider nicht.

              Doch. Das obige beispiel zeigt sowohl im IE, als auch im Mozilla einen Hand-Cursor

              In IE 5.0 aber nicht.

              Oder gleich im CSS des entsprechenden Elements:

              {... cursor:pointer; cursor:hand; ... }

              Die Cursoranzeige soll in meinem Fall dynamisch sein, also leider: auch das geht nicht.

              Doch, auch das würde gehen. Du kannst doch die CSS-Klassen dynamisch austauschen.

              Das ist ein klasse Tipp. Das war mir vorher nicht bewusst. Damit hat sich mein Problem erübrigt.

              Besten Dank
              Andreas

      2. Hallo nochmal!

        Ich habe jetzt Folgendes probiert:

        try
           { document.getElementById(mblock).style.cursor = "pointer";}
        catch (e)
           { alert("error"); return; }

        Leider funktioniert es nicht. :(  IE5 gibt die Fehlermeldung unter catch nicht aus. Weiß irgendjemand, woran das liegen könnte?

        Ich muss das berichtigen. Es funktioniert schon, der Fehler lag an einer anderen Stelle weiter oben im Code.

        Allerdings habe ich eine neue Schwierigkeit entdeckt:

        Die cursor-Anweisung steht bei mir innerhalb einer Schleife. Es sieht so jetzt so aus:

        for (var i=0; i<beliebiges.length; i=i+2)
          {
          try
           {beliebiges[i].style.cursor = "pointer";}
          catch (e)
           {beliebiges[i].style.cursor = "hand"; return;}
          }

        Die Catch-Bedingung wird aber nur für i=0 angewendet. Wie könnte ich das ändern?

        Beste Grüße
        Andreas

  2. Hallo,

    if(document.getElementById)
    {
    ...
    beliebiges[i].style.cursor = "pointer";
    ...
    }

    Bei den meisten Browsern funktuninert das einwandfrei. IE5 (und vielleicht auch andere Browser) benötigen aber die Anweisung

    beliebiges[i].style.cursor = "hand";

    Wie ich beim Durchforstend des Forums schnell gemerkt habe, ist eine Fallunterscheidung durch userAgent (zu recht) ziemlich verpönt. ;-) Mit welcher Objektprüfung könnte ich denn den IE5
    (oder optimalerweise: jeden Browser, der style.cursor = "pointer"; nicht versteht)
    ansprechen?

    Ganz einfach:
    cursor:pointer;
    cursor:hand;
    wichtig: in dieser Reihenfolge!
    nix Fallunterscheidung, nix if(...

    Gruß Fritz

    --
    ss:| zu:) ls:[ fo:| va:) ch:? n4:& rl:? br:& js:| ie:| fl:|
    1. Ganz einfach:
      cursor:pointer;
      cursor:hand;
      wichtig: in dieser Reihenfolge!
      nix Fallunterscheidung, nix if(...

      Hallo Fritz,

      dass es auf diese Weise auch geht, ist mir klar. Allerdings soll in meinem Fall der Cursor als Hand angezeigt werden, sondern lediglich dann, wenn der Browser document.getElementById kennt.

      (Benötigt wird das für ein dynamisches Menü, die Oberpunkte sind bei älteren Browsern eben nicht anklickbar, es sollte also auch nicht der Anschein erweckt werden, dass sie es wären. Siehe http://www.pla-online.de)

      Trotzdem danke.
      Andreas