Hi!
I'm having a hard time hiding my body scroll.
The situation is: I implemented a component to make the popup fullscreen. When it is in fullscreen mode, the Y scroll of the body is showing. I would like only the popup scroll to appear.
If you place (overflow-y: hidden;) on the webscreen, the scroll will always hide. But I want to hide it only when the popup is running (open on the screen). When closing the popup, the page scroll appears again.
Hi Danilo,
Which component you have used to make pop up full screen ? Have you used LayoutPopUp for Pop Up page ?
Thanks and Regards,
Rahul
Hello Rahul!
Yes, I am using the popup layout.
Hey Danilo,
Two things:
1. Isn't it easier to use a modal popup, such that people cannot access the parent?2. Have you tried disabling the scrollbar from the popup via window.parent?
Regards,Lennart
Yes. As it is already an old project. I want to continue working with him, as it is only this modification that I need to make.When I click on the button I use JQuery to make it Fullscren. Follow the code.
$(document).ready(function(){ $('#"+btnExpand.Id+"').click(function(){ $('.os-internal-Popup', window.parent.document).attr('style', 'top: 0px!important'); $('.os-internal-Popup', window.parent.document).css('left','0px'); $('.os-internal-Popup', window.parent.document).css('z-index','5000'); $('.os-internal-Popup', window.parent.document).width('100%'); $('.os-internal-Popup', window.parent.document).height('100%'); });
Danilo Vilarinho Barbosa wrote:
That way I can assign new CSS properties to my popup. But I can't attribute it to the body, which would be the father.
If you put this code snippet inside my onclick, it will hide the Y scroll from my popup. But not my primary webscreen.
$('body').css('overflow-y','hidden');
As I'm also facing this issue on ios phone. once pop up open then background page also scrolling with Pop up.Please do needful on this
You can use conditional CSS to hide the scroll, please follow the below steps to do so:
Step 1: Use a flag (boolean variable, default value as false) inside the screen action from which you open the popup and make it true only when you click to open popup.
Step 2: Use style extended property of the screen and with the help of your flag variable hide the scroll of main screen as shown in below snapshot. (I enclose all the elements of main screen inside the container and use container's style property)
Step 3: Make the variable as false when you close the popup.
Hope this helps you
Regards,
Vipasha
Thanks Vipasha. It is not working for iphone 5s and iphone 6 As I have tested on iphone 11 that issue is not coming on device.