uploadbutton
v0.1.4
Published
UploadButton is a tiny module for a custom stylable upload button. Using HTML5's Custom Element API and Shadow DOM for encapsulation.
Downloads
16
Readme
UploadButton
Requirements
UploadButton
uses both Custom Elements and Shadow DOM which at present time requires a bleeding-edge browser such as Chrome Canary.
Getting Started
Once you've satisfied the requirements you may begin adding the UploadButton
HTML into your DOM:
<button is="upload-button">
Upload File
</button>
With that the registerElement
invocation within the module will register the type extension custom element — upload-button
— as an extension of HTMLButtonElement.prototype
which means that without any styling, the element will appear as a normal button — yet clicking on the element will invoke the file selection modal.
Attributes
By applying certain attributes to the button
element these will automagically be relayed onto the input
element for uploading the files.
accept
, default being *autofocus
, default being unsetdisabled
, default being unsetform
, default being unsetmultiple
, default being unsetname
, default being unsetrequired
, default being unset
Attributes are defined in the usual way with the button
element:
<button is="upload-button" multiple="multiple">
Upload Files
</button>
Note: UploadButton
also supports the adding of data-
attributes to the button
element as well, such as: data-multiple="multiple"
.