IE에서는 iframe 가로 스크롤 막대를 제거할 수 없나요?

StackOverflow https://stackoverflow.com/questions/67354

  •  09-06-2019
  •  | 
  •  

문제

iframe이 있습니다.콘텐츠가 내가 설정한 너비보다 넓어서 iframe에 가로 스크롤 막대가 표시됩니다.iframe의 너비를 늘릴 수 없어서 스크롤 막대만 제거하고 싶습니다.스크롤 속성을 "no"로 설정하려고 시도했지만 두 스크롤 막대가 모두 사라지고 세로 막대가 필요합니다.Overflow-x를 "hidden"으로 설정하려고 시도했는데 ff에서는 가로 스크롤 막대가 사라졌지만 IE에서는 그렇지 않았습니다.나로서는 슬프다.

도움이 되었습니까?

해결책 

scrolling="yes"  horizontalscrolling="no" verticalscrolling="yes"

이를 iFrame 태그에 넣으세요.

CSS에서 형식을 지정하려고 애쓰지 않아도 됩니다.

다른 팁

스크롤바는 <iframe>, 이는 포함된 페이지의 속성입니다.넣어보세요 overflow-x: hidden 에 <html> 내부 페이지의 요소입니다.

iframe을 div 안에 넣은 다음 스크롤에 div를 사용할 수 있습니다.IE에서는 문제 없이 div의 스크롤을 제어할 수 있지만 IE에서는 실제로 iframe 스크롤에만 문제가 있습니다.다음은 트릭을 수행하는 간단한 예입니다.

<html>
    <head>
        <title>iframe test</title>

        <style>         
        #aTest { 
            width: 120px;
            height: 50px;
            padding: 0;
            border: inset 1px #000;
            overflow: auto;
        }

        #aTest iframe {
            width: 100px;
            height: 1000px;
            border: none;
        }
        </style>
    </head>
    <body>
        <div id="aTest">
            <iframe src="whatever.html" scrolling="no" frameborder="0"></iframe>
        </div>
    </body>
</html>

<iframe style="overflow:hidden;" src="about:blank"/>

IE에서 작동해야합니다.IE6에는 Overflow-x 및 Overflow-y를 지원하는 데 문제가 있었습니다.

또 한 가지 주목해야 할 점은 iframe의 IE 테두리는 camelCase에서 "frameborder" 속성을 설정한 경우에만 제거할 수 있다는 것입니다.

<iframe frameBorder="0" style="overflow:hidden;" src="about:blank"/>

CSS로 적절하게 스타일을 지정할 수 있으면 좋겠지만 IE에서는 작동하지 않습니다.

이러한 모든 솔루션은 나에게 적합하지 않았거나 만족스럽지 않았습니다.스크롤 가능한 DIV를 사용하면 가로 스크롤 막대를 없앨 수 있지만, 그러면 항상 세로 스크롤 막대가 표시됩니다.

따라서 모든 iframe의 고정 높이를 확실히 제어할 수 있는 내 사이트에서는 다음 솔루션이 매우 효과적입니다.단순히 DIV를 사용하여 가로 스크롤 막대를 숨깁니다. :)

    <!-- This DIV is a special hack to hide the horizontal scrollbar in IE iframes -->
<!--[if IE]>
<div id="ieIframeHorScrollbarHider" style="position:absolute; width: 768px; height: 20px; top: 850px; left: 376px; background-color: black; display: none;">
</div>
<![endif]-->
<script type="text/javascript">
  if (document.getElementById("idOfIframe") != null && document.getElementById("ieIframeHorScrollbarHider") != null)
  {
    document.getElementById("ieIframeHorScrollbarHider").style.display = "block";
  }
</script>

iframe 내부에 포함된 페이지 본문 너비를 99%로 설정해 볼 수도 있습니다.

라이센스 : CC-BY-SA ~와 함께 속성
제휴하지 않습니다 StackOverflow
scroll top