iframe에서 스크롤바 제거

이 코드 사용

<iframe frameborder="0" style="height: 185px; overflow:scroll; width: 100%" src="http://www.cbox.ws/box/?boxid=439&boxtag=7868&sec=main" marginheight="1" marginwidth="1" name="cboxmain" id="cboxmain" seamless="seamless" scrolling="no" frameborder="0" allowtransparency="true"></iframe>

이것이 어떻게 나타나는지 ( http://www.talkjesus.com 홈페이지의 shoutbox )

가로 스크롤바를 제거하고 세로 스크롤바의 CSS를 수정하려면 어떻게해야합니까?

귀하의 CSS에서 :

iframe{
    overflow:hidden;
}

scrolling="no"iframe에 속성을 추가 합니다.

이것은 모든 브라우저에서 작동합니다. jsfiddle 여기 http://jsfiddle.net/zvhysct7/1/

<iframe src="http://buythecity.com"  scrolling="no" style=" width: 550px; height: 500px;  overflow: hidden;" ></iframe>

추가 scroll="no"및 style="overflow:hidden"iframe이 작동하지 않아 style="overflow:hidden"iframe 내부에로드 된 html 문서의 본문 을 추가해야했습니다 .

scrolling="no"아래와 같은 속성을 추가해보십시오 .

<iframe frameborder="0" scrolling="no" style="height:380px;width:6000px;border:none;" src='https://yoururl'></iframe>

iframe 태그에 scrolling="no"및 seamless="seamless"속성을 추가하기 만하면 됩니다. 이렇게 :-

 1. XHTML => scrolling="no"
 2. HTML5 => seamless="seamless"

여기에있는 누군가가에서 스크롤바를 비활성화하는 데 문제 iframe가있는 경우 iframe의 콘텐츠에 스크롤바가있는 요소 아래 에있을 수 있습니다 .html 요소 .

일부 레이아웃 을 100 % 높이로 설정 html하고 (또는 ) 과 함께 div를 body사용 하여 스크롤을#wrapperoverflow: auto;scroll#wrapper 요소로 .

이 경우 다른 페이지의 내용을 편집하는 것 외에는 스크롤바가 표시되지 않도록하는 조치가 없습니다.

<div id="myInfoDiv" seamless="seamless" scrolling="no" style="width:100%; height: 100%; float: left; color: #FFF; background:#ed8719; line-height:100%; font-size:100%; font-family: sans-serif>;

위의 div를 사용하면 어떤 브라우저에서도 스크롤 막대가 표시되지 않습니다.

두 스크롤 막대를 숨기려면 CSS에 이것을 추가하십시오.

iframe 
{
  overflow-x:hidden;
  overflow-Y:hidden;
}

이것은 최후의 수단이지만 언급 할 가치가 있습니다. 의 부모 ::-webkit-scrollbar에있는 가상 요소를 사용하여 iframe유명한 90 년대 스크롤 막대를 제거 할 수 있습니다.

::-webkit-scrollbar {
    width: 0px;
    height: 0px;
}

편집 : 그것이 비록 상대적으로 지원 , ::-webkit-scrollbar모든 브라우저에 적합하지 않을 수 있습니다. 주의해서 사용하십시오 :)

가로 스크롤 막대 만 숨기려면 CSS에 이것을 추가하십시오.

iframe{
    overflow-x:hidden;
}

iframe {
  display: block;
  border: none;         /* Reset default border */
  height: 100vh;        /* Viewport-relative units */
  width: calc(100% + 17px);
}
div {
  overflow-x: hidden;
}

이와 같이 Iframe의 너비를 예상보다 크게 만듭니다. 그런 다음 overflow-x : hidden으로 수평 스크롤바를 숨 깁니다.