Simple jQuery plugin for creating custom styled form file elements with CSS.
This project is maintained by ttacon
Gile takes normal markup and maps to a hidden file input[type="file"]. This allows you to style file inputs, yay!
Installation is easy - gile depends on jQuery, so include jQuery and then include gile.min.js and gile.min.css and you're good to go!
<link rel="stylesheet" type="text/css" href="/css/gile.min.css"></link>
<script type="text/javascript" src="/js/jquery.gile.min.js"></script>
To use gile just do your normal deal, have your file input - give it something you can select it by though!
<input type="file" class="js-gile-example" />
Then just call gile on it!
<script type="text/javascript">
$(function() {
$('.js-gile-example').gile();
});
</script>
Coming soon!
You may be wondering why I chose the name "gile" - this story is long and colorful. In a nutshell, Billy Bastardi (@b1lly) never ceases to come up with the best names for anything ever (just look at gob and gumi!, yes this is sarcasm). So I wanted to a give this project a name that was equally "unique", and as this is for file inputs, I chose gile!
This plugin is written and maintained by Trey Tacon (@ttacon) - who doesn't normally like js.
Having trouble with Gile? Maybe your problem has already been solved! Check out the known issues at Gile issues. If not, feel free to file a new issue.