tuax/tua-body-scroll-lock

feat: options for overflow

adahei opened this issue · 8 comments

adahei commented

Tua-body-scroll-lock works great and thank you for a nice package!

But I have some trouble using this package together with elements that uses position: sticky (For example headers, top menus etc.)

In some cases overflow: hidden is exactly what I want, but in other cases this doesn't simply work because I use elements that has position: sticky.

It would be great if I could pass some type of options object where I can choose (maybe among other things) what type of overflow value I want.

Br,
Adam

Thank you for your advice, we'll take it into consideration~

adahei commented

overflow: clip; instead of overflow: hidden; works great with position: sticky;.

how about we add an option like overflowType? @evinma

lock(targetElement, { overflowType: 'clip' })

Did you manage to make it work ?
It does not seem to work on our side, it still use overflow: hidden; even when we have lock($offCanvas, { overflowType: 'clip' });

Did you manage to make it work ? It does not seem to work on our side, it still use overflow: hidden; even when we have lock($offCanvas, { overflowType: 'clip' });

It's just for android only now. https://github.com/tuax/tua-body-scroll-lock/blob/213a8804053cfe3f1fc4cf1d488e0c3d6dd49668/src/index.ts#L54C35-L54C47

Do you want to use it on PC?

@BuptStEve Yes, it should respect the option on any device. Otherwise it break our sticky menu

@BuptStEve Yes, it should respect the option on any device. Otherwise it break our sticky menu

@mrleblanc101
Would you give an online reproduction demo?

@BuptStEve Sorry, I forgot about it.
But I faced the issue again on another project:

https://codepen.io/mrleblanc/pen/ZEgxvpj

2024-10-29 13 33 24