Hello,
I have recently implemented the Color Picker in my site and I'm having issues in IE 11. The color picker opens, however, the color picker slider circle that allows me to click on any shade of color doesn't work and always stays in the upper right corner. It will not move.
I'm also not able to enter in a value and apply it, however the default value can be applied by just clicking the Apply button.
Here's a snippet of code implementing the Color Picker
<input id="primaryheadercolor" type="color" value="${geo:object name='DERIVED_COMPONENT.Wizard.GetValue(CntwChooseColorScheme.PRIMARY_HEADERCOLOR)' attribute='value'/}" />
<script>
$("#primaryheadercolor").kendoColorPicker({
buttons: true,
change: function(e) {
$('#primary_header_color').val(e.value);
console.log("The picked color is ", e.value);
console.log(e);
}
});
</script>
The following three files are included.
<link href="/geonext/js/Frameworks/KendoUI/styles/kendo.common.min.css" rel="stylesheet" type="text/css" />
<script src="/geonext/js/Frameworks/KendoUI/js/jquery.min.js" type="text/javascript"></script>
<script src="/geonext/js/Frameworks/KendoUI/js/kendo.web.min.js" type="text/javascript"></script>
Screenshot is attached of what I see in IE11.
I have recently implemented the Color Picker in my site and I'm having issues in IE 11. The color picker opens, however, the color picker slider circle that allows me to click on any shade of color doesn't work and always stays in the upper right corner. It will not move.
I'm also not able to enter in a value and apply it, however the default value can be applied by just clicking the Apply button.
Here's a snippet of code implementing the Color Picker
<input id="primaryheadercolor" type="color" value="${geo:object name='DERIVED_COMPONENT.Wizard.GetValue(CntwChooseColorScheme.PRIMARY_HEADERCOLOR)' attribute='value'/}" />
<script>
$("#primaryheadercolor").kendoColorPicker({
buttons: true,
change: function(e) {
$('#primary_header_color').val(e.value);
console.log("The picked color is ", e.value);
console.log(e);
}
});
</script>
The following three files are included.
<link href="/geonext/js/Frameworks/KendoUI/styles/kendo.common.min.css" rel="stylesheet" type="text/css" />
<script src="/geonext/js/Frameworks/KendoUI/js/jquery.min.js" type="text/javascript"></script>
<script src="/geonext/js/Frameworks/KendoUI/js/kendo.web.min.js" type="text/javascript"></script>
Screenshot is attached of what I see in IE11.