Clever Geek Handbook

MS Edge: IntersectionObserver. Does this work for you?

Before anyone puts too much effort here, I already have a nasty workaround. I just want to know if anyone is working.

Version 15 of Edge is now released and has intersection observer support (for lazy loading).

I have implemented it and it works fine in all browsers that support it (Chrome and Opera, Firefox and Safari are not yet implemented), but not at all in Edge.

No errors are thrown, but the callback is never called.

handleIntersectionElement(elm) {
  if (elm && this.state.enabled && !this.observer) {
    this.observer = new global.IntersectionObserver(this.intersectionCallback, this.options);
    this.observer.observe(elm);
  }
}

The options as below are nothing special:

options = { root: null, rootMargin: '100px', threshold: [0] };

It's part of a React component but doesn't understand why it should matter.

+3


source to share


1 answer


IntersectionObserver cannot observe empty elements whose width and height are 0 in Edge, so you only need to set the border to 1px or min-width: 1px; min-height: 1px;

for the element you want to observe.



+2


source






More articles:


All Articles