In the development of often encountered to remove all of the scroll bar, remove the right scroll bar and retain the bottom of the scroll bar, remove the bottom of the scroll bar and keep the right scroll bar, we are based on how to achieve the JS? In this article, we introduce the implementation method of the removal and retention of the IFRAME scroll bar in JavaScript. Let's have a look!
When the IFRAME is embedded in the page, we sometimes need to adjust the scroll bar, for example, remove all the scroll bars, remove the scroll bar on the right and keep the bottom scroll bar, remove the scroll bar underneath and keep the scroll bar on the right. So what should we do?
One: Remove all the scroll bars
The first method: The IFRAME has a scrolling property, which has the three values of auto, yes, No.
Scrolling:auto-----Scroll bar appears when needed
Scrolling:yes------Always show scroll bars
Scrolling:no-------always hide scroll bars
When you set the Scrolling:no, all the scroll bars are gone.
The second method: I found that in addition to scrolling can remove all the scroll bar, there is another way, in the embedded page to set Body{overflow:hidden}, so you can also remove the scroll bar, and this is when we just want to remove a scroll bar to use the properties.
Two: Remove the scroll bar on the right and keep the scroll bar underneath
If you want to keep the scroll bar below, you can set Body{overflow-x:auto Overflow-y:hidden on the embedded page.
Three: Remove the bottom scroll bar and keep the scroll bar on the right
Set Body{overflow-x:hidden;overflow-y:auto on an embedded page;
We already know that both of these properties can be set to display and hide the scroll bar, so what happens when two are set simultaneously?
Through detection, I found that when scrolling = "Auto" or "yes", if set the body, then will use the body of the setting; when scrolling = "no", no matter what the body set, will use the scrolling Settings, that is, all of the scroll bars have been removed.
The above is a small set of JavaScript for you to introduce the details of the removal and retention of the IFRAME scroll bar, hope to help everyone, if you have any questions welcome to my message, small series will promptly reply to everyone!