如何在显示模态对话框时隐藏主体滚动条？ [英] How to hide the body scroll bar when showing modal dialog?

问题描述

我的首页有很多内容。当我创建任何模态对话框，正文内容滚动条出现，当我们滚动，它的滚动到页面的底部。

My home page has lot of contents. When i create any modal dialog, body content scroll bar is appearing and when we scroll, its scrolling down to the bottom of the page.

在对话框中我还要显示批量内容。所以，如果我可以隐藏身体滚动条和只显示模态的滚动条意味着，这将是一个不错的体验给用户。

In the dialog also i have to display lot content. So, if i can hide the body scroll bar and show only modal's scroll bar means, it would be nice experience to user.

这个想法是当在其顶部显示模态和一些可滚动内容时，禁用主页滚动并仅显示当前可见模型div的滚动。

The idea is when showing modal and some scrollable content on top of it, disables the main page scroll and show only scroll for currently visible model div.

我应该做什么来隐藏主体内容滚动条，并显示为模态div。
我的客户端充满了javascript&

What should i have to do to hide the body content scroll bar and show for modal div. My client side is full of javascript & jquery.

任何建议都会感激。

谢谢。

推荐答案

添加 $（'body'）。css（'overflow'，'hidden'）显示模态和 $（'body'）。css（'overflow'，'scroll'）到你的函数关闭模态。

Add $('body').css('overflow','hidden') to your function that shows the modal, and $('body').css('overflow','scroll') to your function that closes the modal.

这篇关于如何在显示模态对话框时隐藏主体滚动条？的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！