Как скрыть элемент, который в данный момент находится в mousedover и показан с помощью псевдокласса: hover css через jQuery - PullRequest
Новая
       37

Как скрыть элемент, который в данный момент находится в mousedover и показан с помощью псевдокласса: hover css через jQuery

0 голосов
/ 20 июля 2011

У меня есть навигация, которая скрыта за пределами окна просмотра через css и показана при наведении курсора на содержащую li через псевдо-класс: hover. Разметка и css ниже. 

ul li div#someid{position:absolute;left:-9999px;opacity:0;}
ul li:hover div#someid { left:0;opacity:1;z-index:9000;}




 <ul>
     <li>
     <div>The Content to Hide <a href="#runAjax">Click Me</a></div>
     </li>
 </ul>

После нажатия «Click Me» я запускаю jQuery, который заполняет часть страницы на основе значения хеша. Это все отлично работает. Я пытаюсь заставить <div>...</div>, который в данный момент отображается через :hover css, скрыться.

Я прочитал и попытался установить .css('left','-9999px');, а также .removeClass("hover"); и, конечно, я попытался .hide(), но это не дает ему быть видимым и все еще показывает, как мышь наводит курсор на ссылку, как только происходит mouseOut. затем он скрывается в домене, если не установлен .show()

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

Заранее спасибо, гуру.

Ответы [ 2 ]

0 голосов
/ 20 июля 2011

Боюсь, что вы не сможете достичь этого, пока используете псевдокласс :hover.

Если вы можете жить без использования класса :hover, вот как вы можете это сделать с помощью jQuery: http://jsfiddle.net/jHatE/

0 голосов
/ 20 июля 2011

Я бы предложил использовать JS для добавления класса к элементу, который вы хотите скрыть, и иметь некоторый CSS (после: hover CSS), который скрывает любой элемент с этим классом.

Поскольку CSS для нового класса, который скрывает его, находится после CSS, который его показывает, элемент будет скрыт до тех пор, пока ваша специфика CSS не переопределит это.

Добавление / удаление классов часто является действительно хорошим способом управления тем, какие правила стиля CSS контролируют данный элемент.

Например, создайте это правило стиля CSS после других правил стилей, которые влияют на этот объект: 

.hidden {opacity: 0;}

И добавьте «скрытый» класс к объекту. Когда вы хотите, чтобы он снова отображался при наведении, вы просто удаляете «скрытый» класс.

...