Search jQuery

jQuery Forum

Cluetip: How to trigger / activate programmatically?

in Using jQuery Plugins • 12 years ago

Hi,

I am using cluetip on a button. I want to be able to activate the cluetip on the button later as to highlight the button's presence. How can i do this? I have tried:

itemButton.trigger("blur");
itemButton.blur();
itemButton.activate();
itemButton.cluetip("show");
itemButton.cluetip("activate");

I have also tried all on itemButton.find("span")... no luck :(

Thanks,

Lilalfyalien

Here's how I create my button:

var itemButton = $('<a/>', {
id : buttonId,
title : item.value,
href : 'javascript:void(0);',
'class' : 'addedButton inlineAction',
html : item.label
}).button( {
icons : {
secondary : "ui-icon-remove-bin"
}
}).click(function() {
removeItem(item);
});
itemButton.find("span").cluetip( {
cluezIndex : '1010',
splitTitle : '|',
cluetipClass : 'custom',
clickThrough : true
});

Replies(2)

Brian

Re: Cluetip: How to trigger / activate programmatically?

12 years ago

First you have to configure your cluetip to activate on click events:

$("#foo").cluetip({activate:"click"});

Now you can open/close it by triggering cluetip's click event:

$("#foo").trigger("click.cluetip");

Remember, this only works for cluetips that are set to activate on clicks.

Brian

Re: Cluetip: How to trigger / activate programmatically?

12 years ago

I found an issue with my previous response. It seems that the click event listeners that cluetip exposes aren't setup until the first time you click the link. This also applies to other activation types like mouseovers. IMHO this is a bug in cluetip that should be corrected. However, I have found a hacky workaround that will trigger the initial click which will setup the listeners. This only needs to be called the first time you need to display the cluetip, after that you can just call the click.cluetip trigger.

var target = $("#clickme");
$(target
.data("events")
.click).each(function(i,e){
if(e.namespace === "cluetip" && e.type === "click"){
var pos = target.position();
e
.handler
.apply(target, [{pageX:pos.left,pageY:pos.top}]);
}
});

I tested this code on the cluetip demo page and it worked perfectly.

Top Reply

Response title

Attachments

jQuery Forum

Cluetip: How to trigger / activate programmatically?

Replies(2)

Re: Cluetip: How to trigger / activate programmatically?

Re: Cluetip: How to trigger / activate programmatically?

Statistics

Tags

Actions