зеркало из https://github.com/mozilla/gecko-dev.git
57 строки
1.3 KiB
HTML
57 строки
1.3 KiB
HTML
<!DOCTYPE html>
|
|
<html lang="en" reftest-async-scroll>
|
|
<meta charset="utf-8">
|
|
<title>Make sure the scrolled layer is opaque even if the scrolled area is fractional</title>
|
|
|
|
<style>
|
|
|
|
body {
|
|
margin: 0;
|
|
}
|
|
|
|
.scrollbox {
|
|
margin: 50px;
|
|
width: 200px;
|
|
height: 200px;
|
|
overflow: auto;
|
|
|
|
/* Make the background "non-uniform" so that the scrolled layer does not
|
|
* pull up a background color. */
|
|
background: linear-gradient(to bottom, white, transparent);
|
|
}
|
|
|
|
.scrolled-contents {
|
|
height: 300.2px;
|
|
background-color: lime;
|
|
box-sizing: border-box;
|
|
border: 1px solid lime;
|
|
}
|
|
|
|
.transparent-overlap-of-fractional-edge {
|
|
margin: -10px 20px 0;
|
|
height: 40px;
|
|
background-color: rgba(0, 0, 255, 0.5);
|
|
}
|
|
|
|
</style>
|
|
|
|
<body>
|
|
|
|
<div class="scrollbox"
|
|
reftest-displayport-x="0" reftest-displayport-y="-100.2"
|
|
reftest-displayport-w="200" reftest-displayport-h="300.2"
|
|
reftest-async-scroll-x="0" reftest-async-scroll-y="0">
|
|
<div class="scrolled-contents">
|
|
<div class="transparent-overlap-of-fractional-edge reftest-opaque-layer">
|
|
<!-- This element has the magic "reftest-opaque-layer" class which
|
|
constitutes the actual test here. -->
|
|
</div>
|
|
</div>
|
|
</div>
|
|
|
|
<script>
|
|
|
|
document.querySelector(".scrollbox").scrollTop = 100000; /* will end up at 100.2 */
|
|
|
|
</script>
|