Find position where HTML starts on page

daveyand · Oct 25, 2006

Hey Guys,

Am stuck, i need to create an overlaying DIV to a webpage, but i want
it to go over only the HTML content of the page. So if the page is
only within the middle 500px of the screen i want to be able to add my
overlay over that. And ignore the whitespace either side of it.

Does that make sense?

This div will be added via an ad stamp, so i wont be able to change the
page itself.

Any help, even something to look for/at would be much much appreciated.

Thanks in advance.

Andy

ASM · Oct 25, 2006

daveyand a écrit :

Am stuck, i need to create an overlaying DIV to a webpage, but i want
it to go over only the HTML content of the page. So if the page is
only within the middle 500px of the screen i want to be able to add my
overlay over that.

How do you expect to not have you div in the *window* ?
How can you display a *div* anywhere in the *screen* ?

Does that make sense?

Isn't it css's job ?

stylesheet :
============
html, body { height: 100% }
#addDiv { position: absolute; top: 50%; left: 50%;
width: 350px; height: 250px;
margin-top: -125px; margin-left: -175px;
border: 1px solid black;
overflow: scroll;
}

javascript :
============
function addStamp(stamp) {
var d = document.createElement('DIV');
d.id = 'addDiv';
d.innerHTML = stamp;
document.body.appendChild(d);
}

Not tested !

daveyand · Oct 25, 2006

The idea is to have something like this

function create_overlay() {
document.write("<div style='z-index: 1000;'>BLah</div>");
}

and have all the other stuff within it. As said this could be on any
page so i wouldnt be able to add stuff into the page on their side, nor
will i be able to get them to add to much into th page either.

If that makes sense? So i could have the div on this current form
page, or the google homepage, or the Yahoo homepage and it should all
work the same, in taht it adds a floating div the same size as all the
HTML on the page and displays stuff. An annoying overlay advert type
thing.

ASM · Oct 25, 2006

daveyand a écrit :

The idea is to have something like this

function create_overlay() {
document.write("<div style='z-index: 1000;'>BLah</div>");
}

If that makes sense? So i could have the div on this current form
page, or the google homepage, or the Yahoo homepage

you have Google or Yahoo personalized home pages ?
(where you can write)

try (copy-paste in notepad) :

<html>
<script type="text/javascript">
function addStamp(stamp) {
var d = document.createElement('DIV');
d.id = 'addDiv';
d.onclick = function() { this.style.display='none'; }
d.innerHTML = stamp;
document.body.appendChild(d);
}
var myStamp = 'that is only to see what happens. ';
for(var i=0;i<10;i++){myStamp+=myStamp;}
</script>
<style type="text/css" media="screen">
#addDiv { position: fixed; top: 50%; left: 50%;
width: 350px; height: 250px;
margin-top: -125px; margin-left: -175px;
border: 1px solid black;
overflow: scroll; background: lightyellow;
}
p { height: 350px; border: 1px solid red;}
</style>
<p> blah 1</p>
<p><a href="javascript:addStamp(myStamp)">stamp</a></p>
<p>blah 2</p>
</html>

IE will not like this fixed div :-(
..

Background image not showing up on html page	3	Sep 23, 2023
How to have two html audio players on one page?	0	May 3, 2022
Need help making the position of an infinite animation sticky	1	Dec 18, 2022
Help with my responsive home page	2	Dec 14, 2022
HTML Anchor tag not working	2	Dec 15, 2020
HCaptcha - How to stop page from refreshing on submit if captcha is not checked/validated	1	Aug 29, 2023
Having difficulty with the layout of these images / video for this web page	2	Jul 5, 2022
HTML Aligning social media icons	2	Dec 6, 2020

Find position where HTML starts on page

daveyand

ASM

daveyand

ASM

Ask a Question

Similar Threads

Members online

Forum statistics

Latest Threads