Basic Drop Zone
A standard drag-and-drop zone using the built-in mu-dropzone markup. Drag files onto the zone or click to browse.
Drag files here or click to browse
new MultipleUpload(document.getElementById('demo-basic-drop'), {
uploadUrl: '/api/upload',
multiple: true,
dropZoneMode: true
});
The whole control as a drop target
dropZoneMode defaults to false, which gives the standard button-plus-queue layout. Turned on, the container becomes one large drop area with its own icon and prompt, and clicking anywhere in it opens the file dialog — so dragging and clicking both land on the same generous target.
Drag and drop is not the only way in
Design the drop zone as an invitation rather than a requirement. Dragging is awkward on a laptop trackpad and impossible on a phone, and a user who cannot see the page has no way to drag at all. The click-to-browse behaviour is what keeps this usable for everyone, which is why it stays enabled underneath.