jQuery fadeIn fadeOut (или показать / скрыть) проблему

Question

Я пытаюсь показать всплывающую подсказку, когда вы наводите курсор мыши на день в элементе управления календаря.

Я использую событие mouseenter / mouseleave для fadeIn / fadeOut соответственно. Это работает.

Однако моя проблема в том, что это календарь, будет много дней, и когда я перемещаю мышь всю неделю, fadeIn / fadeOut (или show / hide) будет происходить последовательно, пока все события завершены ... есть некоторая задержка, потому что они происходят все последовательно.

Как лучше всего предотвратить это?

Answer 1

Проверьте этот плагин jQuery под названием hoverIntent ... он должен решить вашу проблему.

Answer 2

Я предлагаю вам обработать только событие для всей недели и затем определить, какой день был выбран

Answer 3

Если у вас есть родительский контейнер в течение вашей недели, вы можете просто сделать эффект для этого элемента.

Answer 4

Я бы добавил логику, чтобы проверить, отображается ли уже всплывающая подсказка, и если да, переместите ее и обновите текст.

Сложнее всего добавить логику, чтобы убедиться, что fadeOut происходит только в том случае, если текст не изменился. Первое, что нужно сделать, это добавить небольшую задержку перед исчезновением, используя setTimeout. Во-вторых, создайте переменную, которую вы увеличиваете при каждом обновлении текста всплывающей подсказки. Наконец, убедитесь, что каждый вызов setTimeout включает в себя копию целого числа, и перед вызовом фейдера убедитесь, что целое число не изменилось.