tooltip

sets a popup message next to the colorpicker input when a cursor points to it

string|boolean|function|object tooltip;

Example

// sets a default tooltip that displays the value of colorpicker
webix.ui({
    view:"colorpicker", value:"#7C7C00",
    tooltip:true
});
 
// tooltip as a string
webix.ui({
    view:"colorpicker", value:"#7C7C00",
    tooltip:"Button color: #value#"
});
 
// tooltip as a function
webix.ui({
    view:"colorpicker", value:"#7C7C00",
    tooltip:function(obj){
        return "Button color: " + obj.value;
    }
});
 
// tooltip as an object
webix.ui({
    view:"colorpicker", value:"#7C7C00",
    tooltip:{
        dx:10, dy:20,
        template:function(obj){
            return "Button color: " + obj.value;
        }
    }
});

Related samples

Template of Tooltips

Details

If you define the tooltip as a function, it receives the configuration object of the colorpicker.

If you define the tooltip as an object, you can configure the tooltip and define its template as a string or a function.