058-manual.html (771B)
1 <!doctype html> 2 <title>drag & drop - dragging elements by children that extend out of them</title> 3 <style type="text/css"> 4 div { 5 height: 200px; 6 width: 200px; 7 background: blue; 8 white-space: nowrap; 9 } 10 span { 11 display: inline-block; 12 width: 210px; 13 height: 100px; 14 } 15 span + span { 16 background: orange; 17 width: 100px; 18 } 19 </style> 20 <script type="text/javascript"> 21 window.onload = function () { 22 document.getElementsByTagName('div')[0].ondragstart = function (e) { 23 e.dataTransfer.effectAllowed = 'copy'; 24 e.dataTransfer.setData('text','dummy text'); 25 }; 26 }; 27 </script> 28 <div draggable="true"><span></span><span></span></div> 29 <p>Drag the orange square sideways. Pass if the drag placeholder shows that both the blue and orange squares are being dragged.</p>