CSS парит на элементах

Question

У меня есть два DIV игровой

<div id="a">A</div> 
<div id="b">B</div> 

Я пытаюсь сделать эффект при наведении курсора мыши на #b цвете фона #a изменений. я использовал

CSS

#b:hover + #a{ 
    background: #000; 
} 

Но это не работает.
Если я использую

CSS

#a:hover + #b{ 
    background: #000; 
} 

Он работает. Наведение на #a изменения #b цвет фона.
Но мне нужно сначала работать.

Как сделать первую работу. Почему это не работает?

Answer 1

В + и ~ комбинаторы будет предназначаться братьев и сестер после селектор левой стороны, так что вы пытаетесь сделать в первом примере не представляется возможным с чистым CSS. Если #b предшествует #a в вашей разметке, тогда это сработает.

Answer 2

Попробуйте использовать JQuery:

$("b").hover(function(){ /*hovering*/ 
    $("#a").css("backgroud-color", "#000"); 
}, function(){ /*hovering out*/ 
    $("#a").css("backgroud-color", "set_it_back_to_the_orignial"); 
}); 

Если вы хотите сделать это с помощью CSS, то его невозможно, пока вы не измените разметку и получить #a под #b.

Answer 3

Это не сработает, потому что его значение отличается.

Выберите элемент с идентификатором a, если он непосредственно следует за братом #b. что в этом случае не происходит.