Take down a WebPage from a iframe
I'm currently developping an overlay by using a google chrome extension. Let me explain the architecture. I have my Extension which call in his content_script : overlay.js. This file will inject my toolbar on the web page by using
overlayURL = chrome.extension.getURL("overlay.html"),
iframe = $('<iframe id="You开发者_StackOverflowroverlayFrame" src="'+overlayURL+'">');
body.append(iframe);
So the goal is that overlay.html will appear at the top of my windows. But i have a little problem, it's that my iframe, hide the real web page i'm visiting. So i wanted to know how it can be possible to take down all the web page for something like : 40px and then the overlay won't override the web page.
Example to be easier :
With the overlay: http://img259.imageshack.us/img259/2329/withy.png
Without the overlay: http://img717.imageshack.us/img717/1708/without.png
Thanks in advance.
EDIT : 24/02/2011 - 18:49
I've already tried this :
<script type="text/javascript">
document.getElementById('body').setAttribute("style", "margin-bottom: 40px;");
</script>
But it didn't work.
If you're able to inject HTML into the page (like an iframe), you should be able to add margin to the top of the <body> tag in the amount of the height of your iframe. That should fix it for most sites.
In JavaScript it'd be:
document.getElementsByTagName('body')[0].style.marginTop = '30px'; // or whatever your height is
Let me know if this works out for you.
加载中,请稍侯......
精彩评论