将鼠标悬停在其他div上时更改div [英] Make a div css change when hover an other div

问题描述

我的代码不工作。我发现这是因为divs whoch必须改变其他div ...如何绕过包含其他div的div？
在这个例子中，我想在partagediv

演示中使用partagefbdiv的背景颜色变化： http://jsfiddle.net/u7tYE/1994/

谢谢

>

html：

 < div class =partageid =partage_70 >< img src =/ themes / glace_et_ombre / images / partage.pngborder =0width =22height =21>< / div> 
 
< div class =enveloppe_partage> 
< div class =partagefb>< / div> 
< / div> 
  

css：

  .partage {
 position：relative; 
 float：left; 
 margin：2px; 
光标：指针; 
 z-index：100; 
 width：20px; 
 height：20px; 
} 
 .partagefb {
 position：relative; 
 width：25px; 
 height：25px; 
 margin：100px; 
背景：#ccc; 
} 
 
 .partage：hover〜.partagefb {
 background-color：＃000000; 
} 
 .enveloppe_partage {
 position：absolute; 
 margin：-28px 0 0 115px; 
 
  

解决方案

use

  .partage：hover + .enveloppe_partage .partagefb {
 background-color：＃000000; 
} 
  

My code is not working. I found this is because the divs whoch have to change are in an other div... How to bypass the div containing others? In this example I want the background color change of "partagefb" div when hovering "partage" div

demo: http://jsfiddle.net/u7tYE/1994/

Thanks

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;
}

解决方案

The problem is with your selector use

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

这篇关于将鼠标悬停在其他div上时更改div的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！