Simple jQuery Based Color and Gradient Picker - asColorPicker
File Size: | 597 KB |
---|---|
Views Total: | 9657 |
Last Update: | |
Publish Date: | |
Official Website: | Go to website |
License: | MIT |

asColorPicker is a modular jQuery plugin that appends a fully customizable RGB/HEX color picker to your input field. With support for CSS linear gradients.
See Also:
Basic Usage:
1. Load jQuery JavaScript library and the jQuery asColorPicker plugin's files in your web page.
<link rel="stylesheet" href="css/asColorPicker.css"> <script src="//code.jquery.com/jquery-1.11.1.min.js"></script> <script src="libs/jquery-asColorPicker.min.js"></script>
2. Create a normal Html input and use the value
attribute to specify the initial color code.
<input type="text" class="demo" value="#000">
3. Call the plugin to generate a basic color picker for the input field.
$(document).ready(function() { $(".demo").asColorPicker(); });
4. Available settings to customize your color picker.
// read only mode readonly: false, // skin skin: null, // hide input field hideInput: false, hideFireChange: true, // keyboard support keyboard: false, // i18n lang: 'en', // color options color: { format: false, alphaConvert: { // or false will disable convert 'RGB': 'RGBA', 'HSL': 'HSLA', 'HEX': 'RGBA', 'NAME': 'RGBA', }, shortenHex: false, hexUseName: false, reduceAlpha: true, nameDegradation: 'HEX', invalidValue: '', zeroAlphaAsTransparent: true }, // simple, palettes, complex or gradient mode: 'simple', // callbacks onInit: null, onReady: null, onChange: null, onClose: null, onOpen: null, onApply: null
Change log:
2017-09-12
- v0.4.3: ES5-->ES6
2016-10-17
- v0.4.3: ES5-->ES6
This awesome jQuery plugin is developed by amazingSurge. For more Advanced Usages, please check the demo page or visit the official website.