Hide tooltips while dragging event

How would I hide the tooltip whilst dragging an event? My tooltips are quite large and when I drag an event, they obscure the days behind so I can’t see where I’m dragging event to…

I have tried the following:

[code]scheduler.attachEvent(“onBeforeDrag”,function(event_id, mode, native_event_object){

var ev = scheduler.getEvent(event_id);
if (ev && ev.outcomes != 0) {
//Completed calls can’t be moved
return false;

//Can be moved
dhtmlXTooltip.config.className = ‘dhtmlXTooltip tooltiptransp’;
return true;


Whilst this successfully prevents events with “outcomes” of anything else but “0” value from being moved, it does not switch css for tooltip until I have let the event go.

Not sure how to proceed… The ideal sequence of css switching would be:

  1. Hover over event = tooltip shows
    (“dhtmlXTooltip.config.className = ‘dhtmlXTooltip tooltipreadonly’;”)

  2. Click hold and drag = tooltip hidden
    (“dhtmlXTooltip.config.className = ‘dhtmlXTooltip tooltiptransp’;”)

  3. Drop event = tooltips now showing
    (“dhtmlXTooltip.config.className = ‘dhtmlXTooltip tooltipreadonly’;”)

How do I achieve the above?


Tooltip CSS class won’t be changed while it is still displayed though you can hide tooltip before event drag:

scheduler.attachEvent("onBeforeDrag",function(event_id, mode, native_event_object){ dhtmlXTooltip.hide(); return true; });
Best regards,


I made an update to 4.3.35 and now the dhtmlXTooltip.hide(); is not working anymore. The error is: dhtmlXTooltip is not defined… How can we hide the tooltip now ?


1 Like


By default the tooltip isn’t displayed, when you are dragging event. See the demo:

facing the same issue

Hi, try dhtmlXTooltip.hide(). The method works.