<!DOCTYPE html>
< html lang = "en" >
< head >
< meta charset = 'utf-8' >
<!-- <meta http - equiv="X - UA - Compatible" content="IE=edge"> -->
< meta http-equiv = "Content-Language" content = "en" >
< link href = "../index.css" media = "all" rel = "stylesheet" type = "text/css" / >
< link href = "jsColor.css" media = "all" rel = "stylesheet" type = "text/css" / >
< meta name = "description" content = "colorPicker - Advanced javaScript color picker and color conversion / calculation (rgb, hsv, hsl, hex, cmyk, cmy, XYZ, Lab, alpha, WCAG 2.0, ...); this is a javaScript implememntation example" >
< title > colorPicker javaScript implementation example< / title >
< / head >
< body >
< h1 > Simple javaScript implementation< / h1 >
Calling the colorPicker on all inputs with the calssName 'color': < pre > jsColorPicker('input.color');< / pre >
< p >
< input class = "color" value = "#323f03" / >
< input class = "color" value = "rgb(162, 63, 3)" / >
< input class = "color" value = "hsla(32, 95%, 23%, 0.9)" / >
< / p >
<!-- <button onclick="$colors.colorPicker('destroy')">destroy</button> -->
<!-- <script type="text/javascript" src="../colors.js"></script>
< script type = "text/javascript" src = "../colorPicker.data.js" > < / script >
< script type = "text/javascript" src = "../colorPicker.js" > < / script >
-->
<!-- <script type="text/javascript" src="../color.all.min.js"></script> -->
<!-- <script type="text/javascript" src="jsColor.js"></script>
-->
< script type = "text/javascript" src = "jsColorPicker.min.js" > < / script >
< script type = "text/javascript" >
var colors = jsColorPicker('input.color', {
customBG: '#222',
readOnly: true,
init: function(elm) {
elm.style.backgroundColor = elm.value;
}
});
< / script >
< / body >
< / html >