숨겨진 div 표시 내가 덮을 때

Question

속성이있는 것처럼 숨겨진 div가 있습니다 : display:none. 내가 가리키면 다른 요소가 표시되지 않습니다. 즉, 나타 내기를 원합니다. 또는 IT 위에 마우스를 가져 가면 display:block이 표시됩니다. 나는 그들이 당신이 숨겨진 사업부가 포함 된 div에 마우스를 가져 가면 당신이 사업부를 보여 경우에 작업하는 질문 발견 : Show hidden div on hover

HTML을

<a href="#" id="case1"><div>my hidden div</div></a> 

CSS

#case1{ 
    display: none; 
} 

하는 경우 당신은 나에게 보너스를 줄 수 있고이 관련된 질문에 대답 할 수 있습니다. 감사합니다.

나는 hidd 엉덩이, 난 별도의 이상 a href 링크를 가리키면 보여주고 싶습니다. 하지만 어떤 이유로 작동하지 않습니다 :

HTML

<nav> 
     <ul id="pics"> 
      <li><a href="#"><img src="img1"></a></li> 
      <!--other <li>--> 
     </ul> 
     <ul id="menu"> 
      <li><a href="#">show img1</a></li> 
      <!--other <li>--> 
     </ul> 
</nav> 

난을 img1 숨기려는 내가 쇼을 img1 말한다 a href에 마우스를 가져 가면을 보여줍니다.

모든 도움은 정말로 감사하겠습니다. 감사합니다

Answer 1

첫 번째 질문에 대해서는 잘 보이지 않는 요소 위로 마우스를 가져갈 수 없습니다. (즉 display: none)

당신은 0에 그 opacity 또는 visibility을 설정하려고하지만, 전혀 표시되지 않는 것은 그것이 비 hoverable 수 있습니다.

opacity: 0 효과를 height: 0px (또는 다른 작은 값)과 결합하여 동시에 더 작게 보이지 않게 할 수도 있습니다.

Answer 2

이 CSS를 사용해보세요. visibility 속성은 요소 공간을 보이지 않게 유지하면서 계속 가져갈 수 있습니다.

#case1 { 
    visibility: hidden; 
} 

#case1:hover { 
    visibility: visible; 
} 

Answer 3

display: none 속성은 흐름에서 요소를 제거합니다. 다른 말로하면, 그곳에 있지 않기 때문에 그것을 클릭 할 수 없습니다.

요소가 흐름에 남아 있기를 원하지만 보이지 않게하려면, visibility 또는 opacity을 사용할 수 있습니다.

Answer 4

숨겨진 요소를 가져갈 수는 없지만 앵커의 자식이므로 앵커를 가리킬 수 있습니다. ID를 사용하지 않고

#case1:hover div {display: block;} 

... 두 번째 부분에 대한

a:hover div {display: block;} 

Answer 5

:

$("#menu a").hover(function(){ 
    $("#pics img").show(); 
},function(){ 
    $("#pics img").hide(); 
}); 

데모 :