scroll-margin-propagation-iframe-2.html (750B)
1 <!DOCTYPE html> 2 3 <script src="/common/get-host-info.sub.js"></script> 4 5 <p>Iframe 2</p> 6 7 <div style="width: 200px; height: 200px; overflow-y: scroll; outline: 1px solid purple" id="scroller"> 8 <!-- Spacer to trigger scrolling --> 9 <div style="height: 300px"></div> 10 11 <iframe id="iframe" width=150 height=200></iframe> 12 </div> 13 14 <script> 15 iframe.src = get_host_info().ORIGIN + "/intersection-observer/resources/scroll-margin-propagation-iframe-3.html"; 16 17 window.addEventListener("message", event => { 18 const data = event.data; 19 20 if (data.msgName === "setScrollTop" && data.target === "iframe2") { 21 scroller.scrollTop = data.scrollTop; 22 window.top.postMessage({ msgName: "scrollEnd", source: "iframe2" }, "*"); 23 } 24 }); 25 </script>