CSSホバーdivが

Question

参照例3以下のフィドル中...

https://jsfiddle.net/8opnvq37/1/

HTML

Example 1 
<div class="a">A</div> 
<div class="b">B</div> 
<br /><br /> 
Example 2 
<div class="a">A</div> 
<div id="box"><div class="b">B</div></div> 
<br /><br /> 
Example 3 
<div id="box2"><div class="a">A</div></div> 
<div class="b">B</div> 

CSS

.a:hover ~ .b, 
.a:hover ~ #box .b 
{ 
background: #3F6; 
} 

（ない同じ親の下で）別のdivのスタイルを変更します例1のように、Aの上にマウスを移動すると、& 2が働いています。あなたがそれを指定しない限り、同じ親の下になければなりません。例2に示します。しかし、例3に示すように、.aが別の親の下にある場合は、どのように動作するのですか？

Answer 1

絶対に.a要素をホバーする必要がありますか？もしそうなら、私はそれが純粋なCSSで可能であるかどうかはわかりません。しかし、これは動作します：

#box2:hover ~ .b { background: #3f6; } 

Answer 2

[OK]を私は仕事にはJavaScript

http://jsfiddle.net/6vh5L2t0/

HTML

<div id="c">Div C</div> 
--- 
<div id="box"> 
<div id="d">Div D</div></div> 

Javasciptを使用していることだ

$('#d').hover(
function(){ 
$('#c').css('background', '#F00') 
}, 
function() { 
$('#c').css('background', '') 
});