55 lines
1.2 KiB
HTML
55 lines
1.2 KiB
HTML
<!DOCTYPE html> <!-- webkit-test-runner [ AsyncOverflowScrollingEnabled=true ] -->
|
|
<html>
|
|
<head>
|
|
<meta name="viewport" content="width=device-width, initial-scale=1">
|
|
<style>
|
|
html, body {
|
|
overflow: hidden;
|
|
padding: 0;
|
|
margin: 0;
|
|
}
|
|
|
|
#container {
|
|
width: 100%;
|
|
height: 400px;
|
|
overflow-y: auto;
|
|
position: absolute;
|
|
-webkit-overflow-scrolling: touch;
|
|
scroll-snap-type: y mandatory;
|
|
}
|
|
|
|
.child {
|
|
width: 100%;
|
|
height: 100%;
|
|
scroll-snap-align: start;
|
|
}
|
|
|
|
#fixed {
|
|
position: fixed;
|
|
top: 0;
|
|
right: 0;
|
|
width: 1em;
|
|
height: 1em;
|
|
background-color: white;
|
|
}
|
|
|
|
#output {
|
|
margin-top: 400px;
|
|
}
|
|
</style>
|
|
</head>
|
|
<div id="container">
|
|
<div class="child" style="background-color: red"></div>
|
|
<div class="child" style="background-color: green"></div>
|
|
<div class="child" style="background-color: blue"></div>
|
|
</div>
|
|
<div id="fixed"></div>
|
|
<script>
|
|
if (window.testRunner)
|
|
testRunner.dumpAsText();
|
|
|
|
container.scrollTop = 400;
|
|
fixed.remove();
|
|
document.write(`container.scrollTop is now: ${container.scrollTop}`);
|
|
</script>
|
|
</html> |