show fixed on the first time

[cyberziz]

Hi folks,

first message on this forum. I would like to know: how do you show a tip the first time only (I mean when the tip is loaded), for a couple of seconds? Thanks in advance!

[kiddailey]

To show the tip when it is initialized, set the show.ready property to true.

JS Code

show: {
	ready: true
}

You could also just use an API call to display it after it's been initialized instead.

JS Code

$('.selector').qtip('show');

In either case, you'll probably want to tell the tooltip to not hide automatically as well by setting hide to false.

With qTip v1, I think the best way to hide after a period of time is to use the Javascript setTimeout function in your onShow callback. In the function called at the end of the timeout, use the API to hide it the tip. Something like:

JS Code

onShow: function() { 
	// After 1000ms, hide the qTip
	setTimeout (function() { 
		$('.selector').qtip('hide'); 
	}, 1000); 
}

You might want to consider upgrading to v2 if possible. It's still not officially released, but there is a hide.inactive property you can set to automatically hide a tooltip after a period of inactivity. Not to mention that it is faster, less buggy and more elegant (from a coding perspective) IMO.

[cyberziz]

Thanks for your exhaustive reply! But there is still some issues with this one.

JS Code

jQuery(target).qtip({
    content: 'content',
    style: {
        name: 'light'
    },
    position: {
        corner: {
            target: 'bottomMiddle',
            tooltip: 'topMiddle'
        },
        adjust: {
            y: 8
        }
    }
});

If I embed show: { ready: true } in my code, the tip doesn't appear centered on the bottom of the target (that's what I've been expecting). And if I put jQuery(target).qtip('show'); after that code block, the tip doesn't appear at all. But everything works fine when the tip is displayed on mouse over event.