1 <html> 2 <head> 3 <script> 4 function logDrag(e) { 5 var l = document.getElementById('log'); 6 l.innerHTML += 'shiftKey=' + e.shiftKey + ' ctrlKey=' + e.ctrlKey + ' altKey=' + e.altKey + ' metaKey=' + e.metaKey + '\n'; 7 e.preventDefault(); 8 } 9 10 document.addEventListener('DOMContentLoaded', function() { 11 document.addEventListener('dragenter', logDrag, false); 12 document.addEventListener('dragover', logDrag, false); 13 document.addEventListener('dragleave', logDrag, false); 14 document.addEventListener('drop', logDrag, false); 15 }); 16 </script> 17 </head> 18 19 <body> 20 <p>Drag the "Drag me" with any modifier keys pressed (Shift/Ctrl/Alt) and see if the log messages have the correct modifier state</p> 21 <div draggable='true' id='dragme'> 22 Drag me 23 </div> 24 <pre id='log'></pre> 25 </body> 26 </html> 27