iframe 창의 스크롤 방법을 사용하여 iframe 페이지 스크롤링

페이지에 포함된 iframe의 스크롤을 제어하는 방법은 무엇입니까? 방법은 iframe 창의 스크롤 방법을 사용하는 것입니다:

1. iframe의 창 객체 가져오기

var iwin = document.getElementById('iframe1').contentWindow; 🎜>2. iframe의 창 문서 개체를 가져옵니다.

var doc = iwin.document;

3. iframe 창 개체의 스크롤 메서드를 호출합니다.

scroll(0,doc.body.scrollHeight);

scroll의 두 매개변수는 x축과 y축의 스크롤 양입니다.

doc.body.scrollHeight는 iframe 페이지의 높이입니다. (표시되지 않은 부분도 포함)

종합적인 적용 예시는 다음과 같습니다.

코드 복사 코드는 다음과 같습니다. 다음: 호버 테스트

ul{ background-color:#ff00ff; 디스플레이:블록; .toc li{ 위치:상대적; 너비:10em; 디스플레이:블록; >}

li a { /*display :block;*/ /*블록 모드로 표시되면 전체 상위 요소 공간을 차지합니다*/ background-color:#0000ff; } /*a는 블록 수준 요소로 만들어야 합니다*/

li a i{ display:none }

li a:hover{ text-align:left; }/*여기에 추가된 코드는 IE6에서 표시하기 위해 특별한 기능이 없으며 텍스트 장식, 색상, Z-색인을 제외하고는 작성할 수 있습니다. */

.toc li a:hover i{ width :6em; position:absolute; left:100%; 여기서 100%는 li*/ margin:-1em 0 0em padding:1em; background:#cde border:1px solid red; 🎜>text-align:left; z-index:10000; &lt ;/style>

&lt ;/iframe>

html 코드

1장 용이 보이는 장면 1장 기사가 소환되는 장면 ;li> 1장 과정이 실망한 경우 1장 용이 보이는 곳 &lt ;/a> 1장 용을 보는 장면 1장 용이 보이는 곳 1장 용이 보이는 곳 표시됩니다

function getElementAbsPos(e) 🎜>var t = e.offsetTop; var l = e.offsetLeft; while(e = e.offsetParent) { t = e.offsetTop; 🎜>}

return {left:l,top:t}; }

function getPosition(obj){ var left = 0 var top = 0;

while(obj != document.body){ left = obj.offsetLeft; top = obj.offsetTop; 🎜> 왼쪽으로 돌아가기

var lis = document.getElementsByTagName( 'li') var iwin = document.getElementById('iframe1').contentWindow; var doc = iwin.document; for(var i=0;i lis[i].onmouseover = function(){ var obji = this.childNodes[ 0].childNodes[1]; doc.writeln(' ' obji.innerText ' ,' getElementAbsPos(document.getElementById('toc')).left) doc.writeln(' ' obji.offsetLeft ',' getElementAbsPos(obji).left ',' obji.offsetWidth ', ' obji.style.left) doc.writeln(' ' doc.body.scrollHeight ' ') iwin.scroll(0,doc.body .scrollHeight) //iwin.scrollTo(10000) //잘못됨 } }

iframe 창의 스크롤 방법을 사용하여 iframe 페이지 스크롤링_javascript 기술 제어