iframe 태그에서 스크롤 막대 스타일을 만드는 방법을 가르치고 iframe 태그 사용법을 소개합니다.

이 글에서는 주로 HTML iframe 태그의 스크롤 문제에 대해 설명합니다. 이번 글에서는 iframe 태그의 스크롤 막대 제거 및 유지, 동적 높이의 iframe 로드 후 이중 스크롤 막대 문제 해결에 대해 설명합니다. 등 질문, 지금 기사를 읽어 보겠습니다

먼저 HTML iframe 태그에서 스크롤 막대 제거 및 보존에 대해 살펴보겠습니다.

#🎜 🎜 #iframe이 페이지에 삽입된 후 스크롤 막대를 조정해야 하는 경우가 있습니다. 예를 들어 모든 스크롤 막대를 제거하고 오른쪽 스크롤 막대를 제거하고 아래쪽 스크롤 막대를 유지하고 아래쪽 스크롤 막대를 제거하고 오른쪽 스크롤 막대를 유지합니다. . 그럼 우리는 어떻게 해야 할까요?

1: 모든 스크롤 막대 제거

첫 번째 방법: iframe에는 자동, 예, 아니요 이 세 가지 값을 갖는 스크롤 속성이 있습니다. .

scrolling : auto -----필요할 때 스크롤바가 나타납니다

scrolling : yes ------항상 스크롤바를 표시합니다

#🎜 🎜#scrolling: no -------항상 스크롤 막대 숨기기

스크롤할 때: no를 설정하면 모든 스크롤 막대가 사라집니다.

두 번째 방법: 스크롤하여 모든 스크롤 막대를 제거하는 것 외에 삽입된 페이지에 body{overflow:hidden}을 설정하여 스크롤 막대도 제거할 수 있는 방법이 있다는 것을 발견했습니다. 제거. 이는 특정 스크롤 막대만 제거하려는 경우에도 사용되는 속성입니다.

Two: 오른쪽 스크롤 막대를 제거하고 아래쪽 스크롤 막대를 유지합니다.

아래쪽 스크롤 막대만 유지하려면 다음을 수행하세요. 🎜#

Set body{overflow-x: hided-y: auto;}

#🎜🎜에 본문을 설정하세요. #우리는 이 두 속성이 포함된 페이지의 스크롤 막대 표시와 숨김을 설정할 수 있다는 것을 이미 알고 있습니다. 따라서 두 속성을 동시에 설정하면 어떤 효과가 발생합니까?

테스트를 통해 ="auto" 또는 "yes"로 스크롤할 때 본문이 설정된 경우 ="no"로 스크롤하면 본문 설정이 사용된다는 사실을 발견했습니다. 무시됩니다. 어떤 작업을 수행하든 스크롤 설정이 사용됩니다. 즉, 모든 스크롤 막대가 제거됩니다.

다음으로 가로 스크롤 막대를 제거하는 방법에 대해 이야기하겠습니다.

다음 방법으로 제거할 수 있습니다. # 🎜 🎜#iframe에 포함된 웹페이지에

<style>
html { overflow-x:hidden; }
</style>

을 추가하여 가로 스크롤 막대를 제거할 수도 있습니다. 동일한 방법을 사용하여 세로 스크롤 막대를 제거할 수도 있습니다.

동적 높이의 iframe을 로드한 후 이중 스크롤 막대 문제 해결:

iframe 데이터가 ajax를 통해 비동기적으로 로드되는 경우 div 내부 높이도 동적으로 가져옵니다. 여기에는 문제가 있습니다. div의 콘텐츠가 로드되지 않으면 위의 var 높이가 확장되지 않은 높이만 얻을 수 있습니다. 여기서는 여전히 실제 높이를 얻을 수 없습니다. 모든 것을 기다려야 합니다 문서 트리를 로드한 후 실제 높이를 얻는 방법

iframe 페이지에 작성된 최종 버전

var ht = setInterval('getHeight',100);
function getHeight(){
    if(document.readyState == 'complete'){
        var height = (document.body.scrollHeight)+'px';
        $('parentdiv',window.parent.document).css('height',height);
        window.clearInterval(gh);
    }
}

아마도 더 간단한 해결책이 있을 수 있지만 이것은 차근차근 내가 겪은 일이다. 문제와 해결책을 이끌어내는 아이디어와 코드는 기록할 가치가 있다. 물론, 스크롤 속성을 사용해도 됩니다. 간단한 방법이 있으면 함께 논의해 보세요.

【에디터 추천】# 🎜🎜#

HTML에서 기본 태그의 상대 경로를 작성하는 방법은 무엇입니까? (사용 소개 포함)

HTML img 태그의 src 속성의 사용법은 무엇인가요? 구체적인 사용방법 분석(예시포함)

위 내용은 iframe 태그에서 스크롤 막대 스타일을 만드는 방법을 가르치고 iframe 태그 사용법을 소개합니다.의 상세 내용입니다. 자세한 내용은 PHP 중국어 웹사이트의 기타 관련 기사를 참조하세요!