<!DOCTYPE html>
<html class="reftest-wait">
<title>View transitions: capture root element with scrollbar (ref)</title>
<link rel="help" href="https://drafts.csswg.org/css-view-transitions-1/">
<link rel="author" href="mailto:[email protected]">
<style>
#container {
background: lightblue;
}
#first {
width: 10px;
background: linear-gradient(green, blue);
height: 1000px;
}
body {
margin: 0px;
padding: 0px;
filter: invert(1);
}
</style>
<div id=container>
<div id=first></div>
</div>
<script>
function scrollContainer() {
addEventListener("scroll", () => {
requestAnimationFrame(() => {
requestAnimationFrame(() => {
document.documentElement.classList.remove("reftest-wait");
});
});
}, { once: true, capture: true });
document.documentElement.scrollTop = 500;
}
onload = scrollContainer();
</script>
</html>