iframe에서 스크롤 막대 제거

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 홈페이지 함성창)

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

더하다scrolling="no"iframe합니다에 을 지정합니다.

이것은 모든 브라우저에서 작동합니다.

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

scroll="no"그리고.style="overflow:hidden"프레임이 작동하지 않으면 추가해야 했습니다.style="overflow:hidden"iframe된 html에 합니다.

해 보십시오.scrolling="no"다음과 같은 속성:

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

업데이트:

seamless모든 되었습니다.

---

저스트 애드scrolling="no"그리고.seamless="seamless"iframe입니다에 입니다. 게:-

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

에서 스크롤 하는 데 가 있는 iframe, iframe의 컨텐츠가 아래의 요소에 스크롤 바를 가지고 있기 때문일 수 있습니다.html원소!

:html그리고.body100% 높이로, 그리고 a를 사용합니다.#wrapper브의 overflow: 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를 사용하면 어느 브라우저에서도 스크롤 바가 표시되지 않습니다.

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

이렇게 I 프레임의 너비를 원래보다 크게 만듭니다.그런 다음 overflow-x: hidden으로 수평 스크롤 막대를 숨깁니다.

최후의 수단이지만, 언급할 가치가 있습니다.

를 .::-webkit-scrollbar90년대의 유명한 스크롤 바들을 없애기 위해 아이프레임의 부모에게 가짜 element을 가하는 것입니다.

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

편집: 상대적으로 지원되지만,::-webkit-scrollbar일부 브라우저에는 적합하지 않을 수 있습니다.주의해서 사용하세요 :)

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

두 스크롤 막대를 모두 숨기려면 CSS에 이것을 추가합니다.

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

당신의 css에서:

iframe{
    overflow:hidden;
}

수평 스크롤 막대만 숨기려면 CSS에 이 정보를 추가합니다.

iframe{
    overflow-x:hidden;
}

위의 어떤 답변도 저에게 통하지 않았습니다.JS에서 한 일은 이렇습니다.

iframe 요소를 선택합니다.

var iframe_name = document.getElementById("iframe_name");

속성을 여기에 추가합니다.

  iframe_name.scrolling = "no";

iframe 대신:

const blob = new Blob([data], { type: "application/pdf" });
const link = document.createElement("a");
const URL = window.URL.createObjectURL(blob);
link.href = URL;
link.download = filename;
//download the pdf
link.click();
//open the downloaded pdf in its default viewer
window.open(URL);

스크롤 막대를 숨기기 위해 음의 여백 및 오버플로 숨김 사용

<div class="scrollbar-hider" style="overflow:hidden">
        <div class="scrollbar-hider-margin" style="margin-right: -17px;">
            <iframe src="" 
                    style="display: block; 
                           overflow: hidden scroll; 
                           height:calc(100vh - 65px); 
                           width: 100%" 
                    frameborder="0" loading="lazy">
             </iframe>
        </div>
</div>

seamless="seamless" 스크롤="아니오"

스크롤 막대를 제거하는 데 사용되는 두 특성과 iframe에 접하는 희미한 선입니다.

이 속성을 다른 크기 제한 속성과 결합하여 페이지를 사용자처럼 보이지 않고 다른 페이지에 삽입할 수 있습니다.이렇게 하면 일반적으로 서버에서 공간을 차지하고 기록해야 하는 데이터를 다시 만드는 데 도움이 됩니다.

마지막으로 <href>와 같은 앵커를 포함하면 if 프레임을 페이지의 특정 부분으로 이동시킬 수 있습니다.개체로 향하는 해당 페이지에 통화 레이블을 작성해야 합니다.

재밌게 놀아요!!!! :)

아무것도 작동하지 않을 때, 떠나라:왼쪽이 당신을 안전하게 할 수 있습니다.

iframe{float:left;clear:both;}

언급URL : https://stackoverflow.com/questions/10082155/remove-scrollbar-from-iframe