SpectrumJS, dragger and slider position issue with display: none container

Question

I need to use SpectrumJS inside a div that has the attribute "display: none", but when I remove the attribute to make the div visible, the position of the dragger and the slider does not correspond to the color set. If in container div the attribute "display" isn't set, everything works correctly.

HELP!

Answer 1

depending on your usage of the plugin, you could maybe re-initialize #flat2 after showing it.

<div>
    <input type='text' id="flat" />
</div>
<div style="display: none" id="container">
    <input type='text' id="flat2" />
</div>
<input type="button" value="show div" onclick="$('#container').css('display', 'inline');$('#flat2').spectrum({
    flat: true,
    showInput: true,
    color: '#00aeef'
});"/>

---

Added: or try to initialize and then hide: http://jsfiddle.net/neildaemond/jz37hLre/4/