jQueryより速いoffset値の取得方法

  • 22
    いいね
  • 3
    コメント
この記事は最終更新日から1年以上が経過しています。

このプラグインのソースを読んでたらそんな記述があった。
ScrollMagic/js/jquery.scrollmagic.js at master · janpaepke/ScrollMagic

ネイティブのgetBoundingClientRectというのを使うと。調べてみたらChrome, Firefox, Safariは使えるよう。IEは5から導入されているっていうけど最近のはどうなんだろう。

John Resigも推薦。

John Resig - getBoundingClientRect is Awesome

var getOffset = function($elem, relativeToViewport) {
  var offset = {
    top : 0,
    left: 0
  };
  var elem = $elem[0];
  if (!elem) return offset;
  if (elem.getBoundingClientRect) {
    var rect = elem.getBoundingClientRect();
    offset.top  = rect.top;
    offset.left = rect.left;
    if (!elem.relativeToViewport) {
      offset.top  += $(document).scrollTop();
      offset.left += $(document).scrollLeft();
    }
  }
  else {
    offset = $elem.offset() || offset;
    if (relativeToViewport) {
      offset.top  -= $(document).scrollTop();
      offset.left -= $(document).scrollLeft();
    }
  }
  return offset;
};

というか最近のjQueryには入ってるのか誰か教えて。