jQuery: временно отключить зависание ... непреднамеренный побочный эффект

Question

У меня возникла проблема с .hover ().Я хочу временно отключить его, что я и сделал, но у него был непреднамеренный побочный эффект, от которого я хочу избавиться.

Вот моя скрипка: http://jsfiddle.net/sdPVG/7/

Iя пытаюсь отключить наведение, когда открыта всплывающая подсказка и всплывающее меню (topTip и topDrop).Эти элементы открываются при нажатии на красную иконку (topIconNew), и это расширяет всплывающую подсказку.К сожалению, подсказка остается постоянно расширенной после нажатия.Я хочу, чтобы div вернулся в нормальное (более узкое) состояние.Куда я пошел не так?

Любая помощь приветствуется.Спасибо!

Answer 1

Вам нужно удалить ширину, которую вы установили при расширении.

В вашем $(document).click внесите следующие изменения:

$('div.topTip, div.topDrop').hide();

до

$('div.topTip, div.topDrop').hide().css('width', '');

Answer 2

В обработчике кликов вы забыли повторно включить наведение.

См. эту скрипку

Вам также необходимо сохранить исходную ширину в начале скрипта и восстановить значение для каждой подсказки div. JsFiddle обновлен.

Обратите внимание, что другие ответы возвращают старую ширину путем жесткого кодирования значения "100px". Это уже определено в вашем CSS и дублирование это плохая практика программирования. Мое решение читает значение в начале и повторно использует его, когда это необходимо, поэтому, если вы измените свой CSS, вам не придется обновлять JS.

Answer 3

Вы изменили размер элемента topTip с анимацией ... его необходимо вернуть к исходному размеру.Измените свою функцию "// скрыть выпадающий список и всплывающую подсказку при щелчке снаружи" на:

$(document).click(
    function(){
        hoverEnabled = true;
        $('div.topTip').animate({width:100,marginLeft:0},'fast');
        $('div.topTip, div.topDrop').hide();
    }
);