1<html>
2    <head>
3        <title>Test for WebKit bug 24735: Poor setDragImage support on Windows</title>
4        <style type="text/css">
5
6            .draggable {
7                -webkit-user-drag: element;
8                -webkit-user-select: none;
9            }
10            
11            #linkToUseAsImage {
12                background-color: silver;
13            }
14            
15            #divToUseAsImage {
16                background-color: pink;
17            }
18
19        </style>
20
21        <script type="text/javascript">
22            function dragDivAndSeeImageDragged()
23            {
24                event.dataTransfer.setDragImage(document.getElementById("imgToUseAsImage"), event.pageX, event.pageY);
25            }
26            
27            function dragImageAndSeeDivDragged()
28            {
29                event.dataTransfer.setDragImage(document.getElementById("divToUseAsImage"), event.pageX, event.pageY);
30            }
31        </script>
32    </head>
33    <body >
34        <h3>Test for <a href='https://bugs.webkit.org/show_bug.cgi?id=24735'>WebKit bug 24735</a>: Poor setDragImage support on Windows</h3>
35
36        <p>Instructions: </p>
37        <p>When you drag the first div, the image under the cursor should be of the second image. </p>
38        <p>When you drag the first image, the image under the cursor should be of the second div. </p>
39        
40        <br />
41        <br />
42        
43        <div class="draggable" ondragstart="dragDivAndSeeImageDragged()"> Drag me, I am a div! (first div)</div>
44        <br />
45        <br />
46        <img src="resources/webkit-background.png" class="draggable" ondragstart="dragImageAndSeeDivDragged()" />
47        <br />
48        <br />
49        <img src="resources/drag-image.png" id="imgToUseAsImage" />
50        <br />
51        <br />
52        <div id="divToUseAsImage"> When a drag is started on the image, this is the div that is used as the drag image! (second div)</div>
53    
54    </body>
55</html>
56