6 examples of 'css position relative to parent' in JavaScript

Every line of 'css position relative to parent' code snippets is scanned for vulnerabilities by our powerful machine learning engine that combs millions of open source libraries, ensuring your JavaScript code is secure.

All examples are scanned by Snyk Code

By copying the Snyk Code Snippets you agree to
this disclaimer
183export 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}
Important

Use secure code every time

Secure your code as it's written. Use Snyk Code to scan source code in minutes – no build needed – and fix issues immediately. Enable Snyk Code

25function calcPositionCss(target)
26{
27 var op = $(target).offsetParent().offset();
28 var ot = $(target).offset();
29
30 return {
31 top: ot.top - op.top,
32 left: ot.left - op.left,
33 width: $(target).width()
34 };
35}
259function position_fixed(...elements)
260{
261 var all_bounds = [];
262 // Store all current bounds before manipulating the layout.
263 for (var id in elements) {
264 var el = elements[id];
265 var bounds = el.getBoundingClientRect();
266 bounds = { top: bounds.top, left: bounds.left, width: bounds.width };
267 // Workaround for Chromium (Beaker): sticky elements have wrong position.
268 // With the tabs element, bounds.top is 0, not 40, except when debugging...
269 if (window.getComputedStyle(el).getPropertyValue("position") === "sticky") {
270 el.style.position = "fixed";
271 bounds.top = el.getBoundingClientRect().top;
272 el.style.position = "";
273 }
274 all_bounds[id] = bounds;
275 }
276 // Update the layout.
277 for (var id in elements) {
278 var el = elements[id];
279 var bounds = all_bounds[id];
280 el.style.position = "fixed";
281 el.style.top = bounds.top + "px";
282 el.style.left = bounds.left + "px";
283 el.style.width = bounds.width + "px";
284 }
285}
1280Carousel.prototype._getCssPosition = function _getCssPosition(pos) {
1281 return 'translate' + this._translateAxis + '(' + pos + ')';
1282};
114findAbsolute(reference: Element, target: Element, placement: string): AbsolutePosition {
115 const referenceOffset = this.getAbsoluteOffset(reference as HTMLElement);
116 const referenceRect = reference.getBoundingClientRect();
117 return this.calculatePosition(referenceOffset, referenceRect, target, placement);
118}
783function position(node, offsetParent) {
784 var parentOffset = {
785 top: 0,
786 left: 0
787 },
788 offset; // Fixed elements are offset from window (parentOffset = {top:0, left: 0},
789 // because it is its only offset parent
790
791 if ((0, _style.default)(node, 'position') === 'fixed') {
792 offset = node.getBoundingClientRect();
793 } else {
794 offsetParent = offsetParent || (0, _offsetParent.default)(node);
795 offset = (0, _offset.default)(node);
796 if (nodeName(offsetParent) !== 'html') parentOffset = (0, _offset.default)(offsetParent);
797 parentOffset.top += parseInt((0, _style.default)(offsetParent, 'borderTopWidth'), 10) - (0, _scrollTop.default)(offsetParent) || 0;
798 parentOffset.left += parseInt((0, _style.default)(offsetParent, 'borderLeftWidth'), 10) - (0, _scrollLeft.default)(offsetParent) || 0;
799 } // Subtract parent offsets and node margins
800
801
802 return (0, _extends2.default)({}, offset, {
803 top: offset.top - parentOffset.top - (parseInt((0, _style.default)(node, 'marginTop'), 10) || 0),
804 left: offset.left - parentOffset.left - (parseInt((0, _style.default)(node, 'marginLeft'), 10) || 0)
805 });
806}

Related snippets