summaryrefslogtreecommitdiffstats
path: root/third_party/WebKit/LayoutTests/transitions/object-position-transition.html
blob: 52ad86e6133c994f41567170d1b55547219ef030 (plain)
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
<!DOCTYPE html>

<html>
    <head>
        <title>Transitioning object-position</title>
        <style>
            #box {
                width: 400px;
                height: 400px;
                object-position:-50px -50px;
                transition-duration: 0.5s;
                transition-timing-function: linear;
                transition-property: object-position;
            }
        </style>
        <script src="../animations/resources/animation-test-helpers.js"></script>
        <script>
            const expectedValues = [
              // [time, element-id, property, expected-value, tolerance]
              [0.25, 'box', 'object-position', "25px 75px", 10]
            ];

            function setupTest()
            {
                document.getElementById('box').style.objectPosition = "100px 200px";
            }
            runTransitionTest(expectedValues, setupTest);
        </script>
    </head>
    <body>
        <img id="box" src="../animations/resources/stripes-100.png">
        <div id="result"></div>
    </body>
</html>