jabey
jabey

Reputation: 17

How to use color picker as HTML input element

I want to used color picker as html input element to enter some product colors. I used various color pickers, but not satisfied my requirements. But Finaly I found Spectrum - The No Hassle jQuery Colorpicker to my system.

<html>
<head>
<meta http-equiv="content-type" content="text/html; charset=UTF-8">
<title>Spectrum - The No Hassle jQuery Colorpicker</title>

<meta name="description" content="Spectrum is a JavaScript colorpicker plugin using the jQuery framework.  It is highly customizable, but can also be used as a simple input type=color polyfill">
<meta name="author" content="Brian Grinstead and Spectrum contributors">

<link rel="stylesheet" type="text/css" href="spectrum.css">
<script type="text/javascript" src="docs/jquery-1.9.1.js"></script>
<script type="text/javascript" src="spectrum.js"></script>

</head>
<body>
<input type='color' name='color2' value='#3355cc' />

</body>
</html>

This works with microsoft edge also. But i want add more color picks when i click add button. It's work only with crome. when i used edge i shows only text box. how I solve this problem?

Upvotes: 1

Views: 4955

Answers (2)

Help
Help

Reputation: 1156

Spectrum.js "The No Hassle jQuery Colorpicker" is simplest and one of best color pickers going around.

Open Source

Easy to Use

Many in built color functions.

Link

http://bgrins.github.io/spectrum/#options-showInput

Oops i made a mistake while reading the question.

Here is a working fiddle for spectrum for IE

Link

$(".basic").spectrum({
    color: "#f00",
    change: function(color) {
        $("#basic-log").text("change called: " + color.toHexString());
    }
});

-Help :)

Upvotes: 0

Abdullah A Malik
Abdullah A Malik

Reputation: 354

You can use the Color Picker JQuery Plugin. It is the best out there !

Link: http://www.eyecon.ro/colorpicker

Upvotes: 0

Related Questions