Столкнулся с такой проблемой:
Вот функция с помощью которой происходит всплывающая подсказака:
function info_item(pop) {
$(function () {
// options
var distance = 10;
var time = 250;
var hideDelay = 500;
var pop=".divs_"+pop;
var trig=".item_"+pop;
var hideDelayTimer = null;
// tracker
var beingShown = false;
var shown = false;
var trigger = $(trig, this);
var popup = $(pop, this).css('opacity', 0);
//наводим на элемент
$([trigger.get(0), popup.get(0)]).mouseover(function () {
// показывать элемент
if (hideDelayTimer) clearTimeout(hideDelayTimer);
// не вызывают анимации снова, если уже виден
if (beingShown || shown) {
return;
} else {
beingShown = true;
// сбросить позиции всплывающее окно
popup.css({
top: -100,
left: -33,
display: 'block' // Приносит всплывающих назад, чтобы посмотреть
})
// (we're using chaining on the popup) now animate it's opacity and position
.animate({
top: '-=' + distance + 'px',
opacity: 1
}, time, 'swing', function() {
// once the animation is complete, set the tracker variables
beingShown = false;
shown = true;
});
}
}).mouseout(function () {
// reset the timer if we get fired again - avoids double animations
if (hideDelayTimer) clearTimeout(hideDelayTimer);
hideDelayTimer = setTimeout(function () {
hideDelayTimer = null;
popup.animate({
top: '-=' + distance + 'px',
opacity: 0
}, time, 'swing', function () {
//отслеживаем переменные
shown = false;
popup.css('display', 'none');
});
}, hideDelay);
});
});
}
А вот то как я её вызвываю:
<div class="item_12" onmouseover='info_item(12)'></div>
Сложность в том что у меня динамическое число подсказок, а в уроке смотрел там только на одну подсказку расчитано.
Подскажите можно как нибудь такое реализовать? Или поправте что я сделал не так в коде, если хоть что-то правильно?
