blob: bcffdb3948c0f0be45f822c2e95e8d331f797e7e [file] [log] [blame]
<html>
<head>
<title>Smart Invert Images and Video Test</title>
<style type="text/css">
/* Testing explicit author overrides. */
.invert { filter: invert(1); }
.no-invert { filter: none; }
.preserve-filter { filter: grayscale(1); }
#result { position: absolute; top: -5000px; }
</style>
</head>
<body>
<img class="invert" src="../compositing/resources/simple_image.png" alt="">
<picture class="invert" ><img class="fallback" src="../compositing/resources/simple_image.png" alt=""></picture>
<video class="invert" poster="../compositing/resources/simple_image.png"></video>
<video class="invert" poster="../compositing/resources/simple_image.png" controls></video>
<br>
<img class="no-invert" src="../compositing/resources/simple_image.png">
<picture class="no-invert"><img class="fallback" src="../compositing/resources/simple_image.png" alt=""></picture>
<video class="no-invert" poster="../compositing/resources/simple_image.png"></video>
<video class="no-invert" poster="../compositing/resources/simple_image.png" controls></video>
<br>
<img class="preserve-filter" src="../compositing/resources/simple_image.png" alt="">
<picture class="preserve-filter"><img class="fallback" src="../compositing/resources/simple_image.png" alt=""></picture>
<video class="preserve-filter" poster="../compositing/resources/simple_image.png"></video>
<video class="preserve-filter" poster="../compositing/resources/simple_image.png" controls></video>
<div id="result"></div>
</body>
</html>