I have a fullCalendar page that I am using qTip (v2) on. The problem is that the qTip tip is REALLY slow and sometime does seem to get the mouseover event so that I have to re-mouseover and then it fire. I have an ajax call in that I thought might be slowing it down but when I removed the ajax call there was no difference.
The code below is the eventMouseover from fullcalendar. I didn't include all of the calendar code as I don't believe it is the problem.
eventMouseover: function(calEvent) { // start MouseOver
if (typeof calEvent.TeamDetailID != 'undefined'){ //start undefined
$(this).qtip({
content: {
title: { text: calEvent.title },
text: 'Loading...',
ajax: {
url: '/inc/_runcfc.cfm',
type: 'post',
data: {cfc:'Display'
, cfcMethod:'TeamDetail_popUpDetail'
, TeamDetailID: calEvent.TeamDetailID
},
success: function(data, status) {
this.set('content.text', data);
}
}
},
show: { delay: 0}
}); // (this).qtip
} //end if undefined
} // end mouseOver
I would think that even with the ajax call the tip should pop quickly with the content of "loading...." regardless of the amount of time that it takes the ajax to replace the content. The code above "works" on every other mouseover but still slowly. Is there something wrong in how I am doing this?
The behaviour you're describing looks in-keeping with your code... You're actually configuring the qtip on the first mouseover (the eventMouseover handler) which will then cause qtip to bind its own event handler to the mouseover event (hence why it works on the second mouseover).
However given the eventMouseover event is also called again, you're re-initialising qtip...
Ordinarily I'd be looking to set up the tooltip once and then using one of the events (assuming they're provided in the version of qtip you're using) to conditionally display/hide the tooltip.