| <!DOCTYPe html> |
| <meta charset='utf-8'> |
| <title>drag and drop – feedback overlay of elements partly outside the viewport – 002</title> |
| <style> |
| img { |
| height: 200px; |
| width: 200px; |
| position: absolute; |
| top: 10px; |
| right: -100px; |
| } |
| |
| p { |
| margin-right: 200px; |
| } |
| </style> |
| |
| |
| <img alt='' |
| src='data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAABAAAAAQCAIAAACQkWg2AAAAAXNSR0IArs4c6QAAAARnQU1BAACxjwv8YQUAAAAgY0hSTQAAeiYAAICEAAD6AAAAgOgAAHUwAADqYAAAOpgAABdwnLpRPAAAACRJREFUOE9jZGBoYCARADWQhEhTDXIOScaPaiAyuEaDlXBAAQBiw3iCaRp9LAAAAABJRU5ErkJggg%3D%3D'> |
| |
| <p>Drag the blue box on the right. The drag placeholder should ideally be a blue square. It may optionally be a rectangle the same shape as the visible part of the blue box. No part of the UI should be dragged with the box.</p> |