developit / simple-element-resize-detector

Observes element size changes using a hidden iframe
189 stars 7 forks source link

Don't work in firefox #6

Closed jcubic closed 5 years ago

jcubic commented 7 years ago

It don't work in Firefox, the event is not fired when there is visibility:hidden. If you remove it it's fired.

NekR commented 7 years ago

Yeah, it's known thing. More discussion here: https://github.com/developit/simple-element-resize-detector/pull/5

@developit I think that had to be already merged..

NekR commented 7 years ago

I mean, with correct fix for Firefox, of course

developit commented 7 years ago

Is it good to merge?

jcubic commented 7 years ago

it still will not work in Firefox if visibility:hidden will not be removed.

developit commented 7 years ago

Yup, just meant there was already an open PR for discussing the specific CSS properties to set. IMO it should be:

position:absolute;top:-100%;width:100%;height:100%;margin:1px 0 0;border:0;opacity:0;pointer-events:none;

I have use that setup in other projects with good success across browsers. It can result in an invisible unclickable 1px bar atop resize-observed elements in IE9 though. For me that was okay. @NekR suggested some JavaScript to work around that by setting visibility:hidden only for IE11 and prior.

jcubic commented 7 years ago

I've seen the #5 PR, it don't remove visibility hidden only left:0;top:-100%; opacity:0;

developit commented 7 years ago

Yup, that's why it hasn't been merged yet :)