1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
|
<!doctype html>
<title>Inner document for use in iframes.sub.html test</title>
<script>
function isInView(element) {
let rect = element.getBoundingClientRect();
return rect.top >= 0 && rect.top <= window.innerHeight
&& rect.left >= 0 && rect.left <= window.innerWidth;
}
function postResult() {
let position = 'unknown';
if (window.scrollY == 0)
position = 'top';
else if (isInView(document.getElementById('target')))
position = 'target';
else if (isInView(document.getElementById('elementid')))
position = 'elementid';
let results = {
scrollPosition: position,
href: window.location.href,
};
window.top.postMessage(results, "*");
}
window.addEventListener('message', (e) => {
if (e.data == 'getResult') {
// rAF twice in case there is any asynchronicity in scrolling to the
// target.
window.requestAnimationFrame(() => {
window.requestAnimationFrame(postResult);
})
} else if (e.data == 'reset') {
window.location.hash = '';
window.scrollTo(0, 0);
window.top.postMessage('', "*");
}
});
</script>
<style>
p {
margin-top: 400vh;
margin-bottom: 400vh;
}
</style>
<body>
<p id="target">Target Text</p>
<div id="elementid">DIV</div>
</body>
|
