3 <title>Hit test coplanar elements</title>
4 <script src="point-mapping-helpers.js" type="text/javascript" charset="utf-8"></script>
6 <script type="text/javascript" charset="utf-8">
10 dispatchEvent(44, 44, 'box1', 2, 2);
11 dispatchEvent(70, 59, 'box2', 2, 2);
12 dispatchEvent(70, 101, 'box3', 2, 2);
13 dispatchEvent(70, 144, 'box4', 2, 2);
17 <style type="text/css" media="screen">
21 border: 1px solid black;
26 display: inline-block;
29 border: 1px solid black;
36 -webkit-box-sizing: border-box;
37 background-color: #DDD;
38 border: 1px solid black;
42 outline: 3px solid orange;
50 border: 1px solid black;
51 -webkit-box-sizing: border-box;
52 -webkit-perspective: 400;
61 border: 1px solid black;
62 background-color: #AAA;
63 -webkit-box-sizing: border-box;
64 transform: translateZ(20px);
82 <body onclick="clicked(event)">
84 <div id="results"></div>
86 <!-- Simple transformed div in perpsective -->
87 <div class="container box" id="box1">
88 <div class="transformed box" id="box2"></div>
89 <div class="transformed box" id="box3" style="top: 60px;"></div>
90 <div class="transformed box" id="box4" style="top: 100px;"></div>
93 <p>When hit-testing coplanar elements, document order wins.</p>
95 <div id="mousepos"></div>