Изменение фона другой ссылки при наведении на Первую ссылку

Question

У меня есть следующая отметка.

<ul>
<li><a><span>link-1</span></a></li>
<li><a><span>link-2</span></a></li>
<li><a><span>link-3</span></a></li>
</ul>

Когда пользователь наводит курсор на первый «a», а затем на следующий тег в LI, мы удаляем фоновое изображение.

Надеюсь, вам понятно, что я хочу с этим сделать.

Answer 1

Вам не нужен JavaScript - ура для навыков CSS!

Вы можете сделать это с помощью смежного селектора (+ CSS селектор), попробуйте навести курсор на ссылку в своем HTML-коде, используя этот CSS:

ul li a {
    color: red
}
ul li:hover+li a {
    color: blue
}

( JSFiddle - хороший полигон для испытаний.)

Почему вы хотите что-то с таким низким юзабилити, я не понимаю.
Но, возможно, это имеет смысл в вашем сценарии.

Answer 2

Я думаю, вы можете сделать что-то вроде этого

$('#linka').mouseover(function() {
     $(this).attr('class','somethingrandom'); //so that you can change remaining with ease
     $('.remaininga').removeclass('yourclass'); //whether add a new or remove
}).mouseout(function() {
     $(this).attr('class','remaininga');  //to bring back to previous state
});

С моей точки зрения вам действительно нужно каждый раз менять имя класса, чтобы вы могли изменить оставшийся класс

Answer 3

Вы можете использовать jquery селекторы

пример

$ ('ul: eq (0)> li'). Css ('background', 'none«)

Answer 4

Используйте Jquery.mouseout () для удаления фона.