jTopLeft – Bir elemanın sayfa üzerindeki yerini bulma

JavaScript ile bir elemanın tarayıcının görüş alanına göre ya da ebeveyni olan diğer bir elemana göre x ve y koordinatlarını belirlemeye yönelik bir betik hazırladım ve jQuery eklentisi haline getirdim. Eklentinin kendisini ve sıkıştırılmış halini aşağıda bulabilirsiniz.

Kullanımı:

var top = $('#elm').top();

var left = $('#elm').left();

var pos = $('#elm').pos();
top = pos.top;
left = pos.left;
/*
 * jTopLeft
 * http://www.karalamalar.net/
 *
 * Copyright (c) 2009 İzzet Emre Erkan
 * Licensed under Creative Commons Attribution-Share Alike 3.0 Unported License
 * http://creativecommons.org/licenses/by-sa/3.0/
 *
 * Date: 2009-10-12 17:56:24 +0300 (Mon, 12 Oct 2009)
 * Revision: 3
 */
(function($){  
  $.fn.extend({
    top: function(obj) {
      var o = findPos(this.get(0));
      return obj ? o - findPos(obj) : o;
    },
    left: function(obj) {
      var o = findPos(this.get(0),true);
      return obj ? o - findPos(obj,true) : o;
    },
    pos: function(obj) {
      var pos = {},o;
      
      o = findPos(this.get(0));
      pos.top = obj ? o - findPos(obj) : o;
      
      o = findPos(this.get(0),true);
      pos.left = obj ? o - findPos(obj,true) : o;
      
      return pos;
    }
  });
  function findPos(o,l){
    var x = 0;
    if (o.offsetParent) {
      x = l ? o.offsetLeft : o.offsetTop;
      while (o = o.offsetParent)
        x += l ? o.offsetLeft : o.offsetTop;
    }
    return x;
  }
})(jQuery);

Paketin küçültülmüş halini (802 byte) buradan edinebilirsiniz.

“jTopLeft – Bir elemanın sayfa üzerindeki yerini bulma” üzerine bir yorum

Yorumlar kapalı.