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
