fixed showing colorPicker the first time (quickFix)

colorPicker.js

@@ -358,6 +358,7 @@
 				if (_data._cssFunc) {
 					processCSS(this.width === 1 && this.height === 1);
 				}
+				THIS.cssIsReady = true;
 			};
 			test.src = "data:image/gif;base64,R0lGODlhAQABAIAAAAAAAP///ywAAAAAAQABAAACAUwAOw==";
 		}

jQuery_implementation/jqColor.js

@@ -113,7 +113,8 @@
 							) : $(colorPicker.nodes.colorPicker),
 							$appendTo = $(options.appendTo || document.body),
 							isStatic = /static/.test($appendTo.css('position')),
-							atrect = isStatic ? {left: 0, top: 0} : $appendTo[0].getBoundingClientRect();
+							atrect = isStatic ? {left: 0, top: 0} : $appendTo[0].getBoundingClientRect(),
+							waitTimer = 0;
 
 						options.color = extractValue(elm); // brings color to default on reset
 						$colorPicker.css({
@@ -129,9 +130,13 @@
 						}
 						colorPickers.current = colorPickers[index];
 						$appendTo.append($colorPicker);
-						setTimeout(function() { // compensating late style on onload in colorPicker
+						waitTimer = setInterval(function() { // compensating late style on onload in colorPicker
-							$colorPicker.show(colorPicker.color.options.animationSpeed);
+							if (colorPickers.current.cssIsReady) {
-						}, 0);
+								waitTimer = clearInterval(waitTimer);
+								$colorPicker.show(colorPicker.color.options.animationSpeed);
+							}
+						}, 10);
+						
 					});
 
 					$(window)[onOff]('mousedown.colorPicker', function(e) {

javascript_implementation/jsColor.js

@@ -106,11 +106,12 @@
 							colorPickerUI = colorPicker.nodes.colorPicker,
 							appendTo = (options.appendTo || document.body),
 							isStatic = /static/.test(window.getComputedStyle(appendTo).position),
-							atrect = isStatic ? {left: 0, top: 0} : appendTo.getBoundingClientRect();
+							atrect = isStatic ? {left: 0, top: 0} : appendTo.getBoundingClientRect(),
+							waitTimer = 0;
 
 						options.color = extractValue(elm); // brings color to default on reset
 						colorPickerUI.style.cssText = 
-							'position: absolute;' +
+							'position: absolute;' + (!colorPickers[index].cssIsReady ? 'display: none;' : '') +
 							'left:' + (position.left + options.margin.left - atrect.left) + 'px;' +
 							'top:' + (position.top + +input.offsetHeight + options.margin.top - atrect.top) + 'px;';
 
@@ -122,9 +123,12 @@
 						}
 						colorPickers.current = colorPickers[index];
 						appendTo.appendChild(colorPickerUI);
-						setTimeout(function() { // compensating late style on onload in colorPicker
+						waitTimer = setInterval(function() { // compensating late style on onload in colorPicker
-							colorPickerUI.style.display = 'block';
+							if (colorPickers.current.cssIsReady) {console.log(colorPickers.current.cssIsReady)
-						}, 0);
+								waitTimer = clearInterval(waitTimer);
+								colorPickerUI.style.display = 'block';
+							}
+						}, 10);
 					},
 					mousDownListener = function(e) {
 						var colorPicker = colorPickers.current,