iframe_98vh_scrollable.html (1798B)
1 <!doctype html> 2 <html> 3 <meta charset="utf-8" /> 4 <meta name="viewport" content="width=device-width, user-scalable=no" /> 5 <style> 6 html, 7 body { 8 margin: 0px; 9 padding: 0px; 10 /* background contains one extra transparent.gif because we want trick the 11 contentful paint detection; We want to make sure the background is loaded 12 before the test starts so we always wait for the contentful paint timestamp 13 to exist, however, gradient isn't considered as contentful per spec, so Gecko 14 wouldn't generate a timestamp for it. Hence, we added a transparent gif 15 to the image list to trick the detection. */ 16 background: 17 url("/assets/www/transparent.gif"), linear-gradient(135deg, red, white); 18 } 19 iframe { 20 margin: 0px; 21 padding: 0px; 22 height: 98vh; 23 width: 100%; 24 border: none; 25 display: block; 26 } 27 </style> 28 <iframe 29 frameborder="0" 30 srcdoc="<!DOCTYPE HTML> 31 <html> 32 <style> 33 html, body { 34 height: 100%; 35 width: 100%; 36 margin: 0px; 37 padding: 0px; 38 } 39 </style> 40 <body> 41 <div style='width: 100%; height: 500vh; background-color: green;'></div> 42 <script> 43 if (parent.document.location.search.startsWith('?event')) { 44 document.querySelector('div').addEventListener('touchstart', e => { 45 if (parent.document.location.search == '?event-prevent') { 46 e.preventDefault(); 47 } 48 }); 49 } 50 </script> 51 </body> 52 </html>" 53 > 54 </iframe> 55 </html>