CSS: Наведите указатель мыши и скройте другой div одновременно?

Вот пример CSS, как показать скрытый div (при наведении):

<div class="showhim">HOVER ME<div class="showme">hai</div></div>

и

.showme{ 
display: none;
}
.showhim:hover .showme{
display : block;
}

Можно ли показать один div и скрыть еще один в то же время, используя только CSS? Вот пример использования JS для этой цели: http://jsfiddle.net/joshvito/GaZQ6/

Ответы

Ответ 1

http://jsfiddle.net/MBLZx/

Вот код

 .showme{ 
   display: none;
 }
 .showhim:hover .showme{
   display : block;
 }
 .showhim:hover .ok{
   display : none;
 }
 <div class="showhim">
     HOVER ME
     <div class="showme">hai</div>
     <div class="ok">ok</div>
</div>

Ответ 2

если другой div является дочерним элементом/дочерним элементом или любой комбинацией родительского yes

    .showme{ 
        display: none;
    }
    .showhim:hover .showme{
        display : block;
    }
    .showhim:hover .hideme{
        display : none;
    }
    .showhim:hover ~ .hideme2{ //~ sibling selector
        display:none;
    }
    <div class="showhim">
        HOVER ME
        <div class="showme">hai</div> 
        <div class="hideme">bye</div>
    </div>
    <div class="hideme2">bye bye</div>

Ответ 3

Вы пробовали что-то подобное?

.showme{display: none;}
.showhim:hover .showme{display : block;}
.hideme{display:block;}
.showhim:hover .hideme{display:none;}

<div class="showhim">HOVER ME
  <div class="showme">hai</div>
  <div class="hideme">bye</div>
</div>

Я не знаю причин, почему это не должно быть возможным.