☰

要素オフセットは常に0です 質問する

tag-icon • tag-icon javascript jquery
要素オフセットは常に0です 質問する

リンク列のあるテーブルを使用しています。リンクがクリックされたときに、行のオフセットを取得したいと思います。element.offsetTop と $(element).offset().top を使用してみましたが、どちらも 0 を返し、親要素もオフセット トップとして 0 を返します。

私が試してみました

function getTop(element)
{
   var top = findPosY(element);
   console.log(top); 
}

function findPosY(obj) {
   var curtop = 0;
   if (obj.offsetParent) {
      while (obj.offsetParent) {
         curtop += obj.offsetTop
         obj = obj.offsetParent;
      }
   }
   else if (obj.y)
     curtop += obj.y;
   return curtop;
}

しかし、y 位置では依然として 0 が返されます。

ベストアンサー1

次の関数は、DOM ツリーをたどりながら、その途中で位置を計算します。 および をプロパティとして持つオブジェクトを返すので.x、.yページgetPosition(element).yの先頭からのピクセル数がわかります。

   /**
   * returns the absolute position of an element regardless of position/float issues
   * @param {HTMLElement} el - element to return position for 
   * @returns {object} { x: num, y: num }
   */
  function getPosition(el) {

    var x = 0,
        y = 0;

    while (el != null && (el.tagName || '').toLowerCase() != 'html') {
        x += el.offsetLeft || 0; 
        y += el.offsetTop || 0;
        el = el.parentElement;
    }

    return { x: parseInt(x, 10), y: parseInt(y, 10) };
  }

お役に立てれば ;）

おすすめ記事