0

I am working on a mobile website for a client for which i was asked to incorporate a side menu panel. Now, the functionality i want to achieve is that when that panel opens, the body scroll is disabled but the panel scroll remains. Also, to enable users to be able to close the panel when they click anywhere else on the body, i made a div and positioned it fixed with a translucent background and on click of that div i toggle the side menu. So, to disable the body scroll, i gave it a class of position as fixed and overflow hidden when the menu opens.

Now the problem is that on my localhost, it works perfectly, shows the translucent background and disables the body scroll, but on the live server although the body scroll gets disabled but the translucent div that i created is showing as opaque. I don't understand why. I know this is a CSS issue but inspecting the source doesn't have any conflicting css. if i remove the position fixed from body, it shows the translucent div but the body scroll comes back.

I cant give the link as it is for a client but maybe someone can help me to disable the body scroll in some other way.

Please help.

coder101
  • 1,581
  • 2
  • 18
  • 40
  • You surely know this already, but please show us a minimal fiddle or snippet that reproduces the error. – Drakes May 25 '15 at 05:55
  • @Drakes Thats the point. Even if i show you a minimal fiddle, that would work coz it is working in my local system but not on the live server. Clearly, there is some conflict happening on the live server which is not even showing in the element inspection window. So, i am looking for another solution to achieve this or solve this error. – coder101 May 25 '15 at 05:59
  • http://stackoverflow.com/questions/4770025/how-to-disable-scrolling-temporarily – Antoine Pointeau May 25 '15 at 06:02
  • @AntoinePointeau The answer in that question works fine on the browser emulator, but simply refuses to work on an actual mobile device. – coder101 May 25 '15 at 06:29
  • If it work on your localhost but not in prod you need to find the difference between these two. It's hard to help on css without the env =/ – Antoine Pointeau May 25 '15 at 06:37

0 Answers0