Tinymce Color Picker not working correctly

2
votes

I'm using tinymce 4.3.10 and used it's "colorpicker" plugin to add custom colors in editor. New colors appears perfectly but I can't select colors from it. No error is coming in console and I just can't move the color picker anywhere to select different colors. Following is my code:

tinymce.init({
selector: "textarea:not(.mceNoEditor)",
browser_spellcheck: true,
force_br_newlines: true,
force_p_newlines: false,
forced_root_block: '',
font_formats: 'Arial=arial,helvetica,sans-serif;Courier New=courier new,courier,monospace;AkrutiKndPadmini=Akpdmi-n;Comic Sans MS=comic sans ms,sans-serif;Times New Roman=times new roman,times;',
fontsize_formats: '8pt 10pt 12pt 14pt 18pt 24pt 36pt',
plugins: ["textcolor", "colorpicker", "advlist autolink lists link image charmap print preview anchor", "searchreplace visualblocks code fullscreen", "insertdatetime media table paste"],
toolbar: "fontselect | fontsizeselect | forecolor backcolor | insertfile undo redo | styleselect | bold italic | alignleft aligncenter alignright alignjustify | bullist numlist outdent indent | link image",
height: "200"
});

Here is the screenshot of the issue I'm facing: http://prntscr.com/dz6gok

2
jquerytinymce-4
jsfiddle.net/dkmzhfo3 works for me – urbz
@urbz yes it's working here, but not in my website. What could be the possible reason for this? I've noticed version difference, you are using 4.5.2 but it still didn't fixed the issue. – ÛmÄîr MÄlîk

2 Answers

3
votes

Seems to be a problem with DOM.getPos

The Colorpicker Plugin returns a wrong y Position depending on outer css positions.

See open bug on developers page: https://github.com/tinymce/tinymce/issues/3248

0
votes

I also encountered this problem when I set the style of the body element to "position: relative". After removing the style attribute, it works. I think it should be caused by the pollution of the style.