mirror of
https://github.com/servo/servo.git
synced 2025-06-24 09:04:33 +01:00
37 lines
1.2 KiB
HTML
37 lines
1.2 KiB
HTML
<!DOCTYPE html>
|
|
<html class="reftest-wait">
|
|
<title>Nested scale animations</title>
|
|
<link rel="author" title="Xianzhu Wang" href="mailto:wangxianzhu@chromium.org">
|
|
<link rel="help" href="https://crbug.com/1165408">
|
|
<link rel="match" href="nested-scale-animations-ref.html">
|
|
<meta name="assert" content="Contents under nested scale animations should not be too blurry">
|
|
<script src="/common/reftest-wait.js"></script>
|
|
<style>
|
|
@keyframes scale {
|
|
0% {transform: scale(1);}
|
|
1% {transform: scale(10);}
|
|
100% {transform: scale(20);}
|
|
}
|
|
.animate {
|
|
animation: scale 1s infinite;
|
|
position: relative;
|
|
top: 45%;
|
|
left: 45%;
|
|
width: 10%;
|
|
height: 10%;
|
|
}
|
|
</style>
|
|
<div style="width: 200px; height: 200px; overflow: hidden; position: relative">
|
|
<div class="animate">
|
|
<div class="animate">
|
|
<div style="width: 2px; height: 1px; background: blue"></div>
|
|
<div style="width: 2px; height: 1px; background: green"></div>
|
|
</div>
|
|
</div>
|
|
<!-- To mask off the pixels that may be blurry/antialiased while the rendering
|
|
quality is acceptable. -->
|
|
<div style="position: absolute; top: 95px; left: 0; width: 200px; height: 10px; background: white"></div>
|
|
</div>
|
|
<script>
|
|
takeScreenshotDelayed(200);
|
|
</script>
|