Я пытался понять это некоторое время, но я просто иду кругами.
По сути, у меня есть поле ввода с 2 вариантами, которые можно выбрать. Это не обычный вариант <select>, скорее <ul> с 2 <li>. Что хорошо для того, что я делаю.
В состоянии 1 : это просто обычная форма ввода.
В состоянии 2: пользователь наводит на него курсор и может выбрать (текущее неактивное состояние, которое в приведенном ниже примере является «исключить»).
В состоянии 3 : опция неактивного (исключить) выбирается и переключается с текущим активным (включающим) состоянием, в результате чего исключение становится активным.
Я поместил это в jsfiddle: http://jsfiddle.net/ULafm/13/ - мой переключатель текста не работает должным образом на jsfiddle, хотя он работает на моем локальном сервере, где я разрабатываю).
Самая большая проблема - избавиться от всплывающего окна из .form-filter .link a: hover и .form-filter .link: hover после нажатия на неактивное состояние, как в состоянии 2 на изображении выше.
Я пытался сделать $(".form-filter ul li").removeClass("hover") и некоторые другие варианты, такие как
$(".form-filter ul .li:hover").css("display", "none") или
$(".form-filter ul li a:hover").css("display", "none") но безрезультатно.
Поиск в LinkedIn - пример, аналогичный тому, что я делаю:
Подводя итог одному вопросу: как я могу сделать так, чтобы после переключения текста состояние наведения исчезало, чтобы выглядеть как состояние 3?
Любая помощь будет принята с благодарностью.