много полезен код...даде ми крила да се опитам да го пригодя за конкретната си цел и съм на една идея от успеха. Задала съм tooltip-а да се показва на hover на li (който знаем е блоков елемент), но проблемът ми е, че в това li има повече от един елемент и js съответно се apply-ва на всеки елемент. Резултата е появата на бъг - tooltip-а ту се показва, ту се крие. Ще оценя, ако имаш време и желание да ми помогнеш!

Ето и javascript-a

$(document).ready(function (){
var showCat = 'Show this category';
var hideCat = 'Hide this category';
var show = 'Show this channel';
var hide = 'Hide this channel';
var tooltipBox = $('<div class="tooltip"></div>');
$('li.all').live('mouseover mouseout', function(event) {
$(this).append(tooltipBox);
if (event.type == 'mouseover') {
if ($(this).find('input').is(':checked')){
$(tooltipBox).animate({'opacity' : 'toggle', 'top' : '-52px' }, 200).html(hideCat).append('<div class="arrow"></div>');
} else {
$(tooltipBox).animate({'opacity' : 'toggle', 'top' : '-52px' }, 200).html(showCat).append('<div class="arrow"></div>');
}
$(this).css('color', '#006699');
} else {
$('div.tooltip').remove();
$(this).css('color', '#000');
}
});
$('li.item').live('mouseover mouseout', function(event) {
$(this).append(tooltipBox);
if (event.type == 'mouseover') {
if ($(this).find('input').is(':checked')){
$(tooltipBox).animate({'opacity' : 'toggle', 'top' : '-52px' }, 200).html(hide).append('<div class="arrow"></div>');
} else {
$(tooltipBox).animate({'opacity|' : 'toggle', 'top' : '-52px' }, 200).html(show).append('<div class="arrow"></div>');
}
$(this).css('color', '#006699');
} else {
$('div.tooltip').remove();
$(this).css('color', '#000');
}
});
});

Успех!