016-manual.html (806B)
1 <!DOCTYPE html> 2 <?xml version="1.0" encoding="utf-8"?> 3 <html xmlns="http://www.w3.org/1999/xhtml"> 4 <head> 5 <title>Setting drag image during drag and drop of PNG image</title> 6 <style type="text/css"> 7 span 8 {color:green; 9 background-color:yellow;} 10 img 11 {height:100px; 12 width:100px;} 13 </style> 14 <script type="application/ecmascript"> 15 function start(event) 16 {event.dataTransfer.effectAllowed = 'copy'; 17 event.dataTransfer.setDragImage(document.querySelector('span'), 1, 1);} 18 </script> 19 </head> 20 <body> 21 <p ondragstart="start(event)"> 22 <img src="data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAAIAAAACCAYAAABytg0kAAAAEElEQVR42mNgaGD4D8YwBgAw9AX9Y9zBwwAAAABJRU5ErkJggg==" alt="PNG green pixel"/> 23 </p> 24 <p>Try to drag green box above. You should see word <span>PASS</span> in feedback overlay.</p> 25 </body> 26 </html>