EastDesire/jscolor

api function to check if picker is being displayed.

rodrigoaguilera opened this issue · 2 comments

I want the button that opens the picker, meaning the target element in the following code:

var myPicker = new JSColor(<targetElement>, <options>)

to also close the picker when is open.
I think that a isShown method on the instance can be handy for this.

Hi @rodrigoaguilera , you can actually check target element's classList to see whether it contains class jscolor-active, which means that the color picker is shown on it.

For your use case, the code would be something like this:

<button id="myPicker" data-jscolor="{showOnClick: false}" onclick="this.jscolor[this.classList.contains('jscolor-active') ? 'hide' : 'show']()">
Click me
</button>

(Note that we disabled the default onclick handler here, so that it doesn't interfere with custom show/hide call.)

Please let me know if it does the trick for you.

Thanks for the answer. Exactly what I wanted