10 examples of 'get element position relative to window' in JavaScript

51
export function relative(x: number, y: number, element: Element): number[] {
52
    if (x && x >= 0 && y && y >= 0 && element) {
53
        let scrollX = "pageXOffset" in window ? window.pageXOffset : document.documentElement.scrollLeft;
54
        let scrollY = "pageYOffset" in window ? window.pageYOffset : document.documentElement.scrollTop;
55
        let box = layout(element, scrollX, scrollY);
56
        if (box) {
57
            let [ex, ey, ew, eh]: number[]  = box;
58
            if (ew > 0 && eh > 0) {
59
                return [((x - ex) / ew), ((y - ey) / eh)];
60
            }
61
        }
62
    }
63
    return [null, null];
64
}

22
export function translateAbsoluteToRelativePoint(event, relativeElement) {
23
24
  var zoom = calculateZoom(relativeElement);
25
26
  var left = event.clientX || event.left;
27
  var top  = event.clientY || event.top;
28
29
  var bounds   = relativeElement.getBoundingClientRect();
30
31
  var rx = (left / zoom) - bounds.left;
32
  var ry = (top / zoom)  - bounds.top;
33
34
  return { left: rx, top: ry };
35
}

183
export function position(element, parent) {
184
    const elementOffset = offset(element);
185
    const parentOffset = offset(parent || toNode(element).offsetParent || toWindow(element).document.documentElement);
186
187
    return {top: elementOffset.top - parentOffset.top, left: elementOffset.left - parentOffset.left};
188
}

167
function getRelativeCoords (e) {
168
    var position = $('#placeholder').offset();
169
    return {
170
        x : e.pageX - position.left,
171
        y : e.pageY - position.top
172
    };
173
}

230
public getHTMLElementPosition (element: HTMLElement): IHTMLElementPosition {
231
    if (sys.platform === sys.WECHAT_GAME) {
232
        return {
233
            left: 0,
234
            top: 0,
235
            width: window.innerWidth,
236
            height: window.innerHeight,
237
        };
238
    }
239
240
    const docElem = document.documentElement;
241
    const leftOffset = window.pageXOffset - docElem.clientLeft;
242
    const topOffset = window.pageYOffset - docElem.clientTop;
243
    if (element.getBoundingClientRect) {
244
        const box = element.getBoundingClientRect();
245
        return {
246
            left: box.left + leftOffset,
247
            top: box.top + topOffset,
248
            width: box.width,
249
            height: box.height,
250
        };
251
    } else {
252
        if (element instanceof HTMLCanvasElement) {
253
            return {
254
                left: leftOffset,
255
                top: topOffset,
256
                width: element.width,
257
                height: element.height,
258
            };
259
        } else {
260
            return {
261
                left: leftOffset,
262
                top: topOffset,
263
                width: parseInt(element.style.width || '0', undefined),
264
                height: parseInt(element.style.height || '0', undefined),
265
            };
266
        }
267
    }
268
}

189
function getElementPosition(element) {
190
   var elem=element, tagname="", x=0, y=0;
191
  
192
   while((typeof(elem) == "object") && (typeof(elem.tagName) != "undefined")) {
193
      y += elem.offsetTop;
194
      x += elem.offsetLeft;
195
      tagname = elem.tagName.toUpperCase();
196
197
      if(tagname == "BODY")
198
         elem=0;
199
200
      if(typeof(elem) == "object") {
201
         if(typeof(elem.offsetParent) == "object")
202
            elem = elem.offsetParent;
203
      }
204
   }
205
206
   return {x: x, y: y};
207
}

92
function getElementPosition (el: Element, offset: Object): Object {
93
  const docEl: any = document.documentElement
94
  const docRect = docEl.getBoundingClientRect()
95
  const elRect = el.getBoundingClientRect()
96
  return {
97
    x: elRect.left - docRect.left - offset.x,
98
    y: elRect.top - docRect.top - offset.y
99
  }
100
}

188
function getPosition (element){
189
    let position = {x:0, y:0, z:0};
190
    if(element.attributes.position == null)
191
        return position;
192
193
    let myPos = element.attributes.position.value.split(" ");
194
    if(myPos[0] !== "" && myPos[0] != null)
195
        position['x'] = myPos[0];
196
    if(myPos[1] !== "" && myPos[1] != null)
197
        position['y'] = myPos[1];
198
    if(myPos[2] !== "" && myPos[2] != null)
199
        position['z'] = myPos[2];
200
    return position;
201
}

324
function getOffsetTop(element) {
325
  var offsetTop = 0;
326
327
  do {
328
    offsetTop += element.offsetTop;
329
  } while ((element = element.offsetParent) != null);
330
331
  return offsetTop;
332
}

1
function getAbsPos(e) {
2
  const x = window.pageXOffset + e.getBoundingClientRect().left
3
  const y = window.pageYOffset + e.getBoundingClientRect().top
4
  return { x, y }
5
}