F.Anders: Position eines GIFs ermitteln?

Hallo an alle hier!

ich möchte die Position eines GIFs innerhalb der Seite ermitteln, irgendwie geht das nicht.

Habe es folgendermaßen probiert:

<html>
<title>GetTop</title>
<head>
<script type="text/javascript">
<!--
  function GetTop(Obj)
  {
    if (document.all)
      alert(String(document.all[Obj].style.top));
    else
      alert(String(document.getElementById(Obj).style.top));
  }
//-->
</script>
</head>
<body>
  <img src="test.gif" id="GIF1" onClick = "GetTop('GIF1')";>
</body>
</html>

Wenn ich nun auf das Bild klicke zeigt mit Internet Explorer und FireFox nur ein leeres Fenster an. :-(
Was mach ich falsch?

  1. <html>
    <title>GetTop</title>
    <head>
    <script type="text/javascript">
    <!--
      function GetTop(Obj)
      {
        if (document.all)
          alert(String(document.all[Obj].style.top));
        else
          alert(String(document.getElementById(Obj).style.top));
      }
    //-->
    </script>

    Die Position des Objektes ist nicht in den CSS eigenschaften gespeichert, sondern in offsetTop und Left.

    Aber, dies nur relativ zu seinem paren Element, deshalb ist eine Schleife nötig.

    ich benutze golgende Funktion um die Postion eines Elementes zu ermitteln:

    function getRect (id)  
    {  
        var r = { top:0, left:0, width:0, height:0 };  
      
        if(!id) return r;  
        var o = document.getElementById(id);  
      
        if(!o) return r;  
      
        if(defined(o.offsetTop))  
        {  
             r.height = o.offsetHeight;  
             r.width = o.offsetWidth;  
             r.left = r.top = 0;  
             while (o && o.tagName != 'BODY')  
             {  
                  r.top  += parseInt( o.offsetTop );  
                  r.left += parseInt(o.offsetLeft );  
                  o = o.offsetParent;  
             }  
        }  
        else if(o && defined(o.pageX) )  
        {  
             r.left = o.pageX;  
             r.top = o.pageY;  
             r.height = o.height || o.clip.height;  
             r.width = o.width || o.clip.width;  
        }  
        return r;  
    }
    

    Struppi.

    1. Hi,

      if(defined(o.offsetTop))

      defined()? Muß man das kennen?

      Wenn ja: Warum?

      Wenn man das rausnimmt, dann funktioniert die Funktion. Wenn man es drin läßt, funktioniert sie nicht.

      Gruß, Cybaer

      --
      Hinweis an Fragesteller: Fremde haben ihre Freizeit geopfert, um Dir zu helfen. Helfe Du auch im Archiv Suchenden: Beende deinen Thread mit einem "Hat geholfen" oder "Hat nicht geholfen"!
    2. ich benutze golgende Funktion um die Postion eines Elementes zu ermitteln:

      function getRect (id)

      {
          var r = { top:0, left:0, width:0, height:0 };

      if(!id) return r;
          var o = document.getElementById(id);

      if(!o) return r;

      if(defined(o.offsetTop))
          {
               r.height = o.offsetHeight;
               r.width = o.offsetWidth;
               r.left = r.top = 0;
               while (o && o.tagName != 'BODY')
               {
                    r.top  += parseInt( o.offsetTop );
                    r.left += parseInt(o.offsetLeft );
                    o = o.offsetParent;
               }
          }
          else if(o && defined(o.pageX) )
          {
               r.left = o.pageX;
               r.top = o.pageY;
               r.height = o.height || o.clip.height;
               r.width = o.width || o.clip.width;
          }
          return r;
      }

        
      Oh, da ist mir dich glatt eine Funktion aus meiner Standardbilbiothek, die ich immer benutze, mit reingerutscht:  
        
      function defined(w){ return typeof w != 'undefined'; }  
        
      Das ist nötig, da offsetTop auch null sein kann.  
        
      Struppi.
      
      -- 
      [Javascript ist toll](http://javascript.jstruebig.de/)
      
      1. Hi,

        if(defined(o.offsetTop))
        Das ist nötig, da offsetTop auch null sein kann.

        Bereits der Aufruf einer eigenen Funktion dürfte Probleme bereiten, wenn das als Parameter übergebene Objekt gar nicht definiert ist (ist ja nicht so, daß alle Browser offsetTop überhaupt kennen). Insofern ist der Funktionsname etwas irreführend - und das Script bricht ggf. trotzdem mit Fehler ab.

        Gruß, Cybaer

        --
        Hinweis an Fragesteller: Fremde haben ihre Freizeit geopfert, um Dir zu helfen. Helfe Du auch im Archiv Suchenden: Beende deinen Thread mit einem "Hat geholfen" oder "Hat nicht geholfen"!
        1. if(defined(o.offsetTop))
          Das ist nötig, da offsetTop auch null sein kann.

          Bereits der Aufruf einer eigenen Funktion dürfte Probleme bereiten, wenn das als Parameter übergebene Objekt gar nicht definiert ist (ist ja nicht so, daß alle Browser offsetTop überhaupt kennen). Insofern ist der Funktionsname etwas irreführend - und das Script bricht ggf. trotzdem mit Fehler ab.

          Ich wollte mich zwar nicht mehr auf Diskussionen mit dir einlassen, aber das ist falsch. Wenn o existiert - was bereits vorher geprüft wird - funktioniert das tadelos:

          function defined(w){ return typeof w != 'undefined'; }  
            
          var o = {};  
            
          alert( defined( o.offsetXYZ ) );
          

          Struppi.

          1. Hi,

            Wenn o existiert - was bereits vorher geprüft wird - funktioniert das tadelos:

            Ja, wg.

            var o = document.getElementById(id);

            if(!o) return r;

            ?!

            selfHTML sagt: getElementById() existiert ab NN 6.x, IE 5.5, Op 5.12, Moz 1, Kon 3.1, Saf 1.0!

            selfHTML sagt auch: offsetTop existiert ab IE 4, Op 7, Moz 1, Kon 3.1, Saf 1.0!

            Entweder selfHTML irrt (kommt ja vor), oder ich sehe hier eine Menge an Browsern, die deine Prüfung schaffen, bei Aufruf von defined() (mangels offsetTop) aber die Grätsche machen.

            Gruß, Cybaer

            --
            Hinweis an Fragesteller: Fremde haben ihre Freizeit geopfert, um Dir zu helfen. Helfe Du auch im Archiv Suchenden: Beende deinen Thread mit einem "Hat geholfen" oder "Hat nicht geholfen"!
            1. Wenn o existiert - was bereits vorher geprüft wird - funktioniert das tadelos:

              Ja, wg.

              var o = document.getElementById(id);

              if(!o) return r;

              ?!

              selfHTML sagt: getElementById() existiert ab NN 6.x, IE 5.5, Op 5.12, Moz 1, Kon 3.1, Saf 1.0!

              dumm, im Orginal binde ich ein Skript ein, das document.getElementById für die fehlenden Browser umsetzt. Daher fehlt hier noch if(!document.getElementById) return ...

              selfHTML sagt auch: offsetTop existiert ab IE 4, Op 7, Moz 1, Kon 3.1, Saf 1.0!

              Entweder selfHTML irrt (kommt ja vor), oder ich sehe hier eine Menge an Browsern, die deine Prüfung schaffen, bei Aufruf von defined() (mangels offsetTop) aber die Grätsche machen.

              Es ist genau umgekehrt, es kennen mehr Browser die Eigenschaft offsetLeft/Top als document.getElementById, z.b. mein geliebter IE 4 und die machen bereits da die "Grätsche".

              Wie gesagt, wenn o ein Objekt ist kannst du auf jede x-beliebige Eigenschaft prüfen ohne das irgendjemand die "Grätsche" macht. Solltest du aber Wissen, zumal ich dir ein funktionierendes Beispiel gezeigt habe.

          2. Hi,

            Ich wollte mich zwar nicht mehr auf Diskussionen mit dir einlassen, aber das ist falsch.

            Sich nicht mehr auf Diskussionen mit mir einzulassen? Sicher! ;->

            *Ich* habe halt keine "Probleme", "fremden Input" zu verarbeiten. >;-> Sowas mache ich sehr gerne.

            Und daß man so problemlos mit unbekannten Eigenschaften "rumschmeißen" kann, war mir nicht bewußt. :-))

            Gruß, Cybaer

            --
            Hinweis an Fragesteller: Fremde haben ihre Freizeit geopfert, um Dir zu helfen. Helfe Du auch im Archiv Suchenden: Beende deinen Thread mit einem "Hat geholfen" oder "Hat nicht geholfen"!
            1. Ich wollte mich zwar nicht mehr auf Diskussionen mit dir einlassen, aber das ist falsch.

              Sich nicht mehr auf Diskussionen mit mir einzulassen? Sicher! ;->

              *Ich* habe halt keine "Probleme", "fremden Input" zu verarbeiten. >;-> Sowas mache ich sehr gerne.

              Ich auch, wenn der fremde Input aber auf sture Besserwisserei, verbunden mit unterschwelligen persönlichen Beleidigungen basiert, kann ich darauf verzichten.

              Und daß man so problemlos mit unbekannten Eigenschaften "rumschmeißen" kann, war mir nicht bewußt. :-))

              Was ich sehr befremdlich finde, da ich nicht an deinen Kenntnissen zweifle und du dies durchaus selbst in vielen Skripten anwendest, sogar  dein Beispiel hier in diesem Thread verwendet diese Technik. Du verwechselst dies mit unbekannten Objekten, du kannst und konntest schon immer beliebige Eigenschaften von bekannten Objekten Abfragen.

              1. Hi,

                Was ich sehr befremdlich finde, da ich nicht an deinen Kenntnissen zweifle und du dies durchaus selbst in vielen Skripten anwendest, sogar  dein Beispiel hier in diesem Thread verwendet diese Technik. Du verwechselst dies mit unbekannten Objekten, du kannst und konntest schon immer beliebige Eigenschaften von bekannten Objekten Abfragen.

                Daß das, s. molily, prinzipiell in Bedingungen klappt: Keine Frage. Daß man so etwas auch außerhalb von Bedingungen problemlos einsetzen kann, war mir in der Tat nicht bewußt! :-)

                Gruß, Cybaer

                --
                Hinweis an Fragesteller: Fremde haben ihre Freizeit geopfert, um Dir zu helfen. Helfe Du auch im Archiv Suchenden: Beende deinen Thread mit einem "Hat geholfen" oder "Hat nicht geholfen"!
        2. Hallo,

          if(defined(o.offsetTop))
          Das ist nötig, da offsetTop auch null sein kann.

          Bereits der Aufruf einer eigenen Funktion dürfte Probleme bereiten, wenn das als Parameter übergebene Objekt gar nicht definiert ist (ist ja nicht so, daß alle Browser offsetTop überhaupt kennen). Insofern ist der Funktionsname etwas irreführend - und das Script bricht ggf. trotzdem mit Fehler ab.

          defined(o.offsetTop) wird einfach als Expression aufgelöst. o.offsetTop ergibt den Inhalt dieser Eigenschaft. Wenn sie nicht existiert, ergibt o.offsetTop undefined. undefind kann man problemlos an eine Funktion übergeben. Bei defined(undefined) ist der erste Parameter dann eben undefined vom Typ undefined.

          Mathias

          1. Hi,

            wow, JS ist cleverer, als ich dachte. :-)

            Gruß, Cybaer

            --
            Hinweis an Fragesteller: Fremde haben ihre Freizeit geopfert, um Dir zu helfen. Helfe Du auch im Archiv Suchenden: Beende deinen Thread mit einem "Hat geholfen" oder "Hat nicht geholfen"!
  2. Hi,

    ich möchte die Position eines GIFs innerhalb der Seite ermitteln, irgendwie geht das nicht.

    Elementposition herausfinden.

    Gruß, Cybaer

    --
    Hinweis an Fragesteller: Fremde haben ihre Freizeit geopfert, um Dir zu helfen. Helfe Du auch im Archiv Suchenden: Beende deinen Thread mit einem "Hat geholfen" oder "Hat nicht geholfen"!
    1. ich möchte die Position eines GIFs innerhalb der Seite ermitteln, irgendwie geht das nicht.

      Elementposition herausfinden.

      und um dann das hier auch noch klarzustellen:

      function getX(obj,relative)
      {
      var x=0;
      if(typeof(obj)=="object" && document.getElementById)
      {
      x=obj.offsetLeft;
      if(obj.offsetParent && !relative) { x+=getX(obj.offsetParent); }
      return x;
      } else  { return false; }
      }

      Diese Funktion sperrt zumindest einen Browser aus obwohl er den richtigen Wert liefern könnte. Der IE 4 kann offsetLeft, aber kein document.getElementById (trotzdem macht er aber auch hier keine "Grätsche" sodern liefert einfach false zurück - und wenn man korrekt sein wollte sollte die Funktion im Fehlerfall Number.NaN zurückliefern)