in Google Chrome Google Chrome creates an input with a large strip of color ...">

Disable colorpicker for <input type = "color"> in Google Chrome

Google Chrome <input type="color">creates an input with a large strip of color inside it and by default a color pointer opens (it looks like it depends on the OS, I have a Windows skin). I use a custom colorpicker globally that connects to type="color", which looks like this in most browsers:

text input with colored borders

But in Chrome, it looks like this:

solid colored bar with padding and a colored border

If you've never seen this before, it looks like a bare bone (Windows 7 64-bit version of Google Chrome 22.0.1229.79 m):

enter image description here

The custom colorpicker overrides the default, just fine, but the problem is how it displays in Chrome. Another problem is that I cannot clear the value (tried js), the default value is always #000000and cannot be set to empty.

This may or may not be true, if I do not want this behavior, I should not use it type="color", but sometimes I find the Chrome UI a bit aggressive. Changing the entire input typeis not what I expect, and I'm not sure what else the application is doing with them so that I can break something else. I had similar problems with date pickers.

Chrome, ? JavaScript/jQuery - , CSS -webkit, - .

+5
2

type = color. [type = color] .

, , ASCII; "# 000000" .

+4

User Agent : http://jsfiddle.net/ngBpA/

input[type="color"] {
    -webkit-appearance: textfield;
}

input[type="color"]::-webkit-color-swatch-wrapper {
    display: none;
}

input[type="color"]::-webkit-color-swatch {
    display: none;
}​

, .

User Agent: http://trac.webkit.org/browser/trunk/Source/WebCore/css/html.css

+2

All Articles