두 요소 중 하나를 가리키면 이미지와 배경색이 변경됩니다.

Question

배경색이있는 div가 있고 배경 이미지가있는 <a>이 있습니다. 현재 이미지 위에 마우스를 가져 가면 div 및 이미지의 배경색을 변경해야합니다. 그러나 내가 배경색의 보이는 부분 위로 마우스를 가져 가면 (대부분이 이미지로 덮여 있음) 배경 색상 만 변경되고 이미지는 변경되지 않습니다.

여기 코드가 있습니다.

HTML

<div id="kitchenCol"> 
    <a href="#" class="rollover" title="Kitchens"></a> 
    <p></p> 
</div><!-- End div kitchenCol --> 

CSS

#kitchenCol a.rollover 
{ 
    display:block; 
    width:279px; 
    height:576px; 
    background:url(../images/kitchenCol.jpg); 
} 

#kitchenCol a.rollover:hover{background-position:-279px 0;}  
#kitchenCol{background:#cccccc;} 
#kitchenCol:hover{background:#936768;} 

어떻게 만들 수 그것 때문에 이미지와 내가 이미지 또는 배경 색상 중 하나 위에 마우스를 배경 색상 변경 모두.

Answer 1

나는 이해가 완전히 잘 모르겠지만,이 시도 :

#kitchenCol:hover a.rollover{background-position:-279px 0;}

대신 #kitchenCol a.rollover:hover{background-position:-279px 0;}.

IE6 및 IE7에서도 작동하지 않는 마인드.