iframe嵌套frameset,实现整个iframe框架出现滚动条,怎么样随页面内容的高度全部展示出来?_html/css_WEB-ITnose
我做的网站,是用frameset框架布局,分上中下,上面和下面框架部分的内容是固定的,中间框架内容是不同的,我想让整个框架共用一个滚动条,就用iframe嵌套frameset框架,我在iframe中设置了高度,页面内容不一样,高度也不一样了,有什么办法能让页面的内容全部展示出来?纠结两天了,很急,在线等!请各位大侠帮帮忙!
回复讨论(解决方案)
动态计算中间框架的高度,在《body onload里面加上上面、下面的高度,赋值给外面的iframe的style.height
怎么动态计算呀?请说明白一点吗?
h = document.documentElement?document.documentElement.offsetHeight:document.body.offsetHeight
这个是能子框架的页面的高度吗?
2个iframe能共用一个滚动条,好奇怪啊
-------------------------------
<script> <br /> function iFrameHeight(iframeID){ <br /> var ifm= document.getElementById(iframeID); <br /> var subIfm = ifm.contentWindow.document.documentElement.scrollHeight; <br /> if(ifm != null && subIfm != null){ <br /> ifm.height = subIfm; <br /> } <br /> } <br /> </script>
这个是我引入框架布局的页面
这个是中间框架的,你再加上上、下的固定高度,然后+"px"
不是两个iframe啦
我加了上下框架的高度,但是中间框架的页面内容不一样,高度也就不一样了,我获取不到中间页面的高度?
我加了上下框架的高度,但是中间框架的页面内容不一样,高度也就不一样了,我获取不到中间页面的高度?
不是告诉你动态计算的吗???
给你完整的例子
a.htm
<!DOCTYPE html><html><head><title></title></head> <body><iframe id=foo src="frameset.htm"></iframe></body></html>
frameset.htm
<frameset rows="100,*,100"><frame src="top.htm"><frame src="middle.htm"><frame src="bottom.htm"></frameset>
middle.htm
<script>function setHeight(){ h = Math.max(document.documentElement.offsetHeight,document.body.offsetHeight) window.parent.parent.document.getElementById("foo").style.height = 100+h+100 + 50+"px"; //为了保证效果,多加50}</script><style>html,body{margin:0;padding:0}</style><body onload="setHeight()">foo<br/>foo<br/>foo<br/>foo<br/>foo<br/>foo<br/>foo<br/>foo<br/>foo<br/>foo<br/>foo<br/>foo<br/>foo<br/>foo<br/>foo<br/>foo<br/>foo<br/>foo<br/>foo<br/>foo<br/>foo<br/>foo<br/>foo<br/>foo<br/>foo<br/>foo<br/>foo<br/>foo<br/>foo<br/>foo<br/>
注意,测试要使用http方式,不要直接说文件方式测试
给你完整的例子
a.htm
HTML code
nbsp;html>
frameset.htm
HTML code
谢谢拉
给你完整的例子
a.htm
HTML code
nbsp;html>
frameset.htm
HTML code
谢谢拉
本帖最后由 net_lover 于 2012-09-14 10:54:53 编辑
给你完整的例子
a.htm
XML/HTML code?1234567891011nbsp;html>
用了你的代码,但是ie里最外侧的滚动条无法用鼠标滚轮控制,在火狐和chrome里能控制,不知道什么原因?
本帖最后由 net_lover 于 2012-09-14 10:54:53 编辑
给你完整的例子
a.htm
XML/HTML code?1234567891011nbsp;html>
还有获取第一个页面的高度后跳转其他页面时仍然保持第一个页面的高度,我在跳转页面中加了获取高度代码的

핫 AI 도구

Undresser.AI Undress
사실적인 누드 사진을 만들기 위한 AI 기반 앱

AI Clothes Remover
사진에서 옷을 제거하는 온라인 AI 도구입니다.

Undress AI Tool
무료로 이미지를 벗다

Clothoff.io
AI 옷 제거제

AI Hentai Generator
AI Hentai를 무료로 생성하십시오.

인기 기사

뜨거운 도구

메모장++7.3.1
사용하기 쉬운 무료 코드 편집기

SublimeText3 중국어 버전
중국어 버전, 사용하기 매우 쉽습니다.

스튜디오 13.0.1 보내기
강력한 PHP 통합 개발 환경

드림위버 CS6
시각적 웹 개발 도구

SublimeText3 Mac 버전
신 수준의 코드 편집 소프트웨어(SublimeText3)

뜨거운 주제











이 기사는 HTML & lt; Progress & Gt에 대해 설명합니다. 요소, 그 목적, 스타일 및 & lt; meter & gt의 차이; 요소. 주요 초점은 & lt; progress & gt; 작업 완료 및 & lt; meter & gt; Stati의 경우

이 기사는 HTML & LT; Datalist & GT에 대해 논의합니다. 자동 완성 제안을 제공하고, 사용자 경험을 향상시키고, 오류를 줄임으로써 양식을 향상시키는 요소. 문자 수 : 159

기사는 HTML5 크로스 브라우저 호환성을 보장하기위한 모범 사례에 대해 논의하고 기능 감지, 점진적 향상 및 테스트 방법에 중점을 둡니다.

이 기사는 HTML & lt; meter & gt에 대해 설명합니다. 범위 내에 스칼라 또는 분수 값을 표시하는 데 사용되는 요소 및 웹 개발의 일반적인 응용 프로그램. & lt; meter & gt; & lt; Progress & Gt; 그리고 Ex

이 기사에서는 브라우저에서 직접 사용자 입력을 검증하기 위해 필요한, Pattern, Min, Max 및 Length 한계와 같은 HTML5 양식 검증 속성을 사용하는 것에 대해 설명합니다.

이 기사는 모바일 장치의 반응 형 웹 디자인에 필수적인 Viewport Meta Tag에 대해 설명합니다. 적절한 사용이 최적의 컨텐츠 스케일링 및 사용자 상호 작용을 보장하는 방법을 설명하는 반면, 오용은 설계 및 접근성 문제로 이어질 수 있습니다.

이 기사는 & lt; iframe & gt; 외부 컨텐츠를 웹 페이지, 공통 용도, 보안 위험 및 객체 태그 및 API와 같은 대안을 포함시키는 태그의 목적.

GiteEpages 정적 웹 사이트 배포 실패 : 404 오류 문제 해결 및 해결시 Gitee ...
