將鼠標懸停在其他div上時改變分隔線

我的代碼無法使用。我發現這是因爲divs whoch必須改變其他div ...如何繞過包含其他div的div？在這個例子中，我想「partagefb」 div的背景顏色變化徘徊在「partage」格將鼠標懸停在其他div上時改變分隔線

演示：http://jsfiddle.net/u7tYE/1994/

感謝

HTML：

<div class="partage" id="partage_70"><img src="/themes/glace_et_ombre/images/partage.png" border="0" width="22" height="21"></div> 

    <div class="enveloppe_partage"> 
     <div class="partagefb"></div> 
    </div>

CSS：

.partage{ 
    position:relative; 
    float:left; 
    margin: 2px; 
    cursor:pointer; 
    z-index: 100; 
    width:20px; 
    height:20px; 
} 
.partagefb{ 
    position:relative; 
    width: 25px; 
    height: 25px; 
    margin:100px; 
    background: #ccc; 
} 

.partage:hover ~ .partagefb{ 
    background-color:#000000; 
} 
.enveloppe_partage{ 
    position: absolute; 
    margin: -28px 0 0 115px; 
}

來源

2013-07-26 Recif

對不起，但這不是我的配置。我的具體問題是2個div位於不同的容器中。 – Recif

你想要這種類型嗎？請看這個鏈接http://jsfiddle.net/u7tYE/1997/ – krutssss

剛剛回答下面，謝謝;-) – Recif

問題是與你的選擇使用

.partage:hover + .enveloppe_partage .partagefb{ 
background-color:#000000; 
}

來源

2013-07-26 10:09:43 vipulsharma

是的，就是這樣，謝謝！ :-) – Recif

這裏是fiddle

添加標識到div

讓HTML作爲

<div class="partage" id="partage_70"> 
    <img src="/themes/glace_et_ombre/images/partage.png" border="0" width="22" height="21"> 
    </div> 
    <div class="enveloppe_partage" id="ank"> 
    <div class="partagefb"></div> 
    </div>

而且CSS可能是

#partage_70:hover + .enveloppe_partage #ank { 
    background-color:#000000; 
}

來源

2013-07-26 10:08:55

剛剛回答，謝謝;-) – Recif

將鼠標懸停在其他div上時改變分隔線

回答

相關問題