The rules of CSS/HTML maintain that a child element cannot visually "break out" of its parent element.
The behavior you mention could be observed in the other Telerik controls which use the pop up behavior as well -RadToolTip, for example. The problem is a result of the popup element of these controls being rendered where the control itself is rendered which is needed in scenarios in which there are ajax updates. However, this leads to the behavior you observe and it could be resolved if the popup element is added to the form element instead of where it is declared. As we have received other requests for such a behavior from our customers, we think to add a property to these controls which could be used to specify where the popup element of the control to be rendered. For the time being, the solution here would be to "trick" the colorpicker to be added to the root of the body rather than to where it is declared.
Please add the following code to the page with the colorpicker(it overrides a colorpicker method) and give it a try:
|TelerikTelerik.Web.UI.RadColorPicker.prototype._oldCreatePalette = Telerik.Web.UI.RadColorPicker.prototype._createPalette;
|Telerik.Web.UI.RadColorPicker.prototype._createPalette = function()
| var div = document.createElement('div');
| div.className = "radcolorpicker RadColorPicker_Default";
| var form = document.forms;
Please, note that if you use a different skin from the Default
one you will need to change the Default
word to the name of the skin you use in the className
of the div element above.
Let us know if you need further assistance.
the Telerik team
Check out Telerik Trainer
, the state of the art learning tool for Telerik products.