z-index.html (691B)
1 <!DOCTYPe html> 2 <meta charset='utf-8'> 3 <title>drag and drop – feedback overlay for heavily styled elements – 008</title> 4 <style> 5 a { 6 display: block; 7 height: 200px; 8 width: 200px; 9 background-color: blue; 10 position: absolute; 11 top: 100px; 12 left: 10px; 13 z-index: 1; 14 } 15 16 div { 17 background-color: orange; 18 position: absolute; 19 height: 200px; 20 width: 200px; 21 top: 150px; 22 left: 20px; 23 z-index: 2; 24 opacity: 0.9; 25 } 26 27 28 </style> 29 30 <p>Click and hold the part of the orange box that overlaps the blue box. Then 31 move your pointing device. The blue box should <em>not</em> be dragged. 32 33 <a draggable="true" ondragstart="event.dataTransfer.effectAllowed ='copy'">TEST</a> 34 35 <div></div>