jQuery Plugin To Resize Text As You Input - Liquid Input
File Size: | 87.4 KB |
---|---|
Views Total: | 428 |
Last Update: | |
Publish Date: | |
Official Website: | Go to website |
License: | MIT |
Liquid Input is a small and user friendly jQuery plugin used to resize the text size of an input field based on the filled content you input.
How to use it:
1. Include jQuery javascript library and the jQuery Liquid Input plugin at the bottom of your page.
<script src="http://ajax.googleapis.com/ajax/libs/jquery/1.11.0/jquery.min.js"></script> <script src="js/liquidinput.js"></script>
2. Create a standard Html text input on your web page.
<input type="text" class="liquid" placeholder="Type here">
3. Call the plugin on the input field you created and set the minimum font size.
<script> $('.liquid').liquidInput(0.75); </script>
4. You must set width and height to input, or it's size will comply the font size.
input { height: 36px; width: 100%; ... }
This awesome jQuery plugin is developed by icenel. For more Advanced Usages, please check the demo page or visit the official website.