2011-02-24 12 views
1

현재 Google 크롬 확장을 사용하여 오버레이를 개발 중입니다. 아키텍처에 대해 설명하겠습니다. 그의 Extension은 그의 content_script : overlay.js를 호출합니다. 이 파일은 웹 페이지에 내 도구 모음을 삽입하여 사용합니다.iframe에서 웹 페이지 가져 오기

overlayURL = chrome.extension.getURL("overlay.html"), 
iframe = $('<iframe id="YouroverlayFrame" src="'+overlayURL+'">'); 

body.append(iframe); 

그래서 목표는 overlay.html이 내 창 상단에 나타납니다. 하지만 약간의 문제가 있습니다. 그게 내 iframe이고, 방문중인 실제 웹 페이지를 숨길 수 있습니다. 그래서 저는 40px와 같은 오버레이가 웹 페이지를 덮어 쓰지 않도록 모든 웹 페이지를 무너 뜨리는 것이 가능한지 알고 싶었습니다. 오버레이없이 http://img259.imageshack.us/img259/2329/withy.png

:

오버레이로 :

예 쉬울 사전에 http://img717.imageshack.us/img717/1708/without.png

감사합니다.

편집 : 24/02/2011 - 나는 이미 시도했습니다 18시 49분

:

<script type="text/javascript"> 
    document.getElementById('body').setAttribute("style", "margin-bottom: 40px;"); 
</script> 

하지만이 작동하지 않았다.

답변

0

iframe과 같은 페이지에 HTML을 삽입 할 수 있다면 iframe의 높이만큼 <body> 태그의 상단에 여백을 추가 할 수 있어야합니다. 그 에 대 한 가장 사이트에 대 한 그것을 고정해야합니다.

자바 스크립트 그것은 것 :

document.getElementsByTagName('body')[0].style.marginTop = '30px'; // or whatever your height is 

이 당신을 위해 밖으로 작동하는지 알려주세요.

+0

그게 내가 시도했지만, 작동하지 않았다. document.getElementById ('body'). setAttribute ("style", "margin-bottom : 40px;"); – Sindar

+0

이것이 또한'position : absolute' 엘리먼트를 제거하는지 궁금합니다. 그들은 머무를 것인가, 아니면 아래로 움직일 것인가? – pimvdb

+0

내가 추가 한 코드를 참조하십시오. ''몸 ''은 신분증이 아닙니다. 따라서 페이지에서 body 요소 인 요소의 첫 번째 요소를 가져와야합니다. 또한 bottom-margin은 존재하지 않고 요소의 끝 부분에 있습니다. 'document.getElementsByTagName ('body') [0] .setAttribute ('style', 'margin-top : 40px;'); 이렇게하면 다른 스타일을 날려 버릴 것입니다. body 태그의 'style'속성에 있습니다. – sholsinger

관련 문제