Drag and drop files anywhere to upload.
$ component install component/drop-anywhere
var dropAnywhere = require('drop-anywhere');
var drop = dropAnywhere(function(err, drop){
switch (drop.type) {
case 'file':
console.log('upload %s', drop.item.file.name);
break;
case 'html':
case 'text':
case 'url':
break;
}
});Unbind event handlers.
The classname .show is used to actually display the dropzone,
so you must style it accordingly with display: block, something
like:
@-webkit-keyframes show {
from {
opacity: 0;
}
to {
opacity: 1;
}
}
body {
text-align: center;
}
#drop-anywhere {
position: fixed;
top: 0;
left: 0;
width: 100%;
height: 100%;
background: rgba(0,0,0,.8);
line-height: 500px;
text-align: center;
color: white;
display: none;
}
#drop-anywhere::before {
content: 'Drop to upload!';
}
#drop-anywhere.show {
display: block;
-webkit-animation: show 300ms;
}MIT
React
Typescript
Django
Laravel
Facebook
Microsoft
Google
Alibaba
D3
Tencent