Tiny jQuery colorPicker

Tiny jQuery colorPicker - mobile first, tiny foot print, fast, scaleable, flexible and pluggable...
This 4.7KB small HSB color picker is based on a subset of colors.js from it's big brother colorPicker, supports all modern features like touch and MS pointer, GPU accelerated rendering, battery friendly requestAnimationFrame and provides a lot of hooks for developers to write plugins.

Features

Tiny jQuery colorPicker only loads into memory if triggered to show and auto repositiones inside view-port if it doesn't fit. It uses battery saving technologies, super fast rendering for best performance on desktop and mobile browsers and renders perfectly smooth on retina and high resolution displays.
This colorPicker is very flexible to modify and customize and there is an easy way to write plugins to extend functionality, look and feel...
As Tiny jQuery colorPicker uses colors.js from it's big brother colorPicker, it provides a clean and rich color model and API that enables flexible extending for programmers.

sex shop sex shop sex shop sex shop sex shop seks shop spanish fly psikolog sohbet numara sohbet hatti

Source: dematte.at

1. INCLUDE JS FILES

<script src="http://code.jquery.com/jquery-1.11.2.min.js"></script>
<script type="text/javascript" src="jqColorPicker.min.js"></script>

2. HTML

<input class="color no-alpha" value="#B6BD79" />

3. JAVASCRIPT

$('.color').colorPicker();

4. OPTIONS

colorPicker uses an instance of Colors and passes the options to it, so some values are the same...

$('.color').colorPicker({
    color: ..., // see Colors...
    customBG: '#FFF' // see Colors...
    animationSpeed: 150, // toggle animation speed
    GPU: true, // use transform: translate3d
    doRender: true | 'selector', // manipulate color and bgColor of input field (on certain elements if selector)
    opacity: true, // enable / disable alpha slider
    renderCallback: function($elm, toggled) {}, // this === instance; $elm: the input field;toggle === true -> just appeared; false -> opposite; else -> is rendering on pointer move
    // toggled true/false can for example be used to check if the $elm has a certain className and then hide alpha,...
    buidCallback: function($elm) {}, // this === instance; $elm: the UI
    css: '', // replaces existing css
    cssAddon: '', // adds css to existing
    margin: '', // positioning margin (can also be set in cssAddon)
    scrollResize: true // toggle for reposition colorPicker on window.resize/scroll
    gap: 4 // gap to right and bottom edge of view port if repositioned to fit
    preventFocus: false // prevents default on focus of input fields (e.g. no keyboard on mobile)
    body: document.body // the element where the events are attached to (touchstart, mousedown, pointerdown, focus, click, change)
});