67
Easy Custom File Input With JavaScript And CSS – Input-file.js
source link: https://www.tuicool.com/articles/hit/vq6zAnq
Go to the source link to view the article. You can view the picture content, updated content and better typesetting reading experience. If the link is broken, please click the button below to view the snapshot at that time.
Author:
pb03
Views Total:
1,399
Official Page:
Go to website
Last Update:
November 5, 2018
License:
MIT
Preview:
Description:
Input-file.js is a super lightweight JavaScript plugin which replaces the nativefile input with your own CSS styles. Supports drag’n’drop and multi file selection.
How to use it:
Insert the required JavaScript and CSS files into the html file.
<link rel="stylesheet" href="input-file.css"> <script src="input-file.min.js"></script>
Insert file input fields into your html form.
<form> <input type="file" name="files" multiple> <br><br> <input type="file" name="files" multiple> </form>
Initialize the Input-file.js and done.
new InputFile({
// options
});
Change the label for the file select button.
new InputFile({
buttonText: 'Choose files'
});
Customize the help text.
new InputFile({
hint: 'or drag and drop files here'
});
Set the message to show after selection.
new InputFile({
message: 'files chosen'
});
Recommend
About Joyk
Aggregate valuable and interesting links.
Joyk means Joy of geeK