2
0
mirror of https://github.com/PitPik/colorPicker.git synced 2025-06-28 13:41:02 -06:00

43 lines
1.8 KiB
HTML
Raw Normal View History

2014-09-07 17:49:36 +02:00
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset='utf-8'>
2014-09-07 18:22:31 +02:00
<!-- <meta http-equiv="X-UA-Compatible" content="IE=edge"> -->
2014-09-07 17:49:36 +02:00
<meta http-equiv="Content-Language" content="en">
<link href="../index.css" media="all" rel="stylesheet" type="text/css" />
<link href="jqColor.css" media="all" rel="stylesheet" type="text/css" />
<script src="http://code.jquery.com/jquery-1.11.0.min.js"></script>
<script type="text/javascript" src="https://code.jquery.com/ui/1.11.1/jquery-ui.min.js"></script>
<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 jQuery implememntation example">
<title>colorPicker jQuery implementation example</title>
</head>
<body>
<h1>Simple jQuery implementation</h1>
Calling the colorPicker on all inputs with the calssName 'color': <pre>$('input.color').colorPicker();</pre>
<p>
<input class="color" value="#323f03" />
<input class="color" value="rgb(162, 63, 3)" />
<input class="color" value="hsl(32, 95%, 23%)" />
</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> -->
2014-09-07 17:49:36 +02:00
<script type="text/javascript" src="jqColor.js"></script>
<!-- <script type="text/javascript" src="jQueryColorPicker.min.js"></script> -->
2014-09-07 17:49:36 +02:00
<script type="text/javascript">
2014-09-13 20:48:07 +02:00
var $colors = $('input.color').colorPicker({customBG: '#222', readOnly: true}).each(function(idx, elm) { // {multipleInstances: true}
2014-09-07 17:49:36 +02:00
$(elm).css({'background-color': this.value})
});
</script>
</body>
</html>