hover 요소 A, 표시/숨기기 요소 B

나는 <div> 요소에 이미지가 있습니다. 해당 div 안에는 이미지에 대한 정보가 들어있는 <p> 요소가 있습니다. 이미지가 포함 된 <div>을 가리키고 <p> 요소를 표시하거나 숨기려고합니다.hover 요소 A, 표시/숨기기 요소 B

<div class="box"> 
    <img src="img/an_039_AN_diskette.jpg" width="310px" height="465px" /> 
    6 Pharma IT 
    <p class="hoverbox">some information</p> 
</div>

jQuery에서 쉽게 할 수 있습니까?

출처

2009-07-13 mourique

당신이 HTML 마크 업을 제공 할 수 P.을 모든 이미지와 일치하고, 태그를 가진 첫 형제를 대상집니다 네가하고 싶은 걸로? 나는 약간 불명확하다. –

죄송합니다 코드를 포맷하는 것을 잊어 버렸습니다 – mourique

 $("css_selector_of_img").hover(
     function() { 
     $("css_selector_of_p_element").show(); 
     }, 
     function() { 
     $("css_selector_of_p_element").hide(); 
     } 
    );

는 http://docs.jquery.com/Events/hover가

출처

2009-07-13 14:59:42 synhershko

어디에 넣어야합니까? 내가 document.ready 부분에서 머리 속에 쓰면 남은 부분이 깨질 것입니다. – mourique

페이지 끝에 으로 둘러싸인 바로 앞에 document.ready를 사용하는 것과 비슷한 jQuery가 붙습니다. – synhershko

다음은

<script type="text/javascript"> 
$(document).ready(function(){ 
    $("div.box img").hover(
     function(){$(this).siblings("p:first").show();}, 
     function(){$(this).siblings("p:first").hide();} 
    ); 
}); 
</script> 

<div class="box"> 
    <img src="somefile.jpg" /> 
    <p>This text will toggle.</p> 
</div>

출처

2009-07-13 15:00:49 Sampson

나는 같은 일을하고 있습니다.하지만 제 단락은 약 100 줄입니다. 따라서 전체 단락을 아래로 스크롤해야합니다.이 경우 콘텐츠 (여기)에서 내 호버를 제거하면 내용이 숨겨집니다. 어떻게해야합니까? –

$('#divwithimage').hover(
     function(){$('#ptag').show();}, //shows when hovering over 
     function(){$('#ptag').hide();} //Hides when hovering finished 
);

출처

2009-07-13 15:01:25 AutomatedTester

쉼표를 잊어 버리지 말고 두 가지 기능. – Sampson

문제 없습니다. 좋은 일을 계속해라. – Sampson

나는 화산재에서 이것을 얻는다 : 누락; 이전 진술 – mourique

<div class="box"> 
    <img ... /> 
    <p class="hoverbox">Some text</p> 
</div> 

<script type="text/javascript"> 
    $('div.box img').hover(
     function() { $('div.box p.hoverbox').show(); }, 
     function() { $('div.box p.hoverbox').hide(); } 
    ); 
</script>

출처

2009-07-13 15:04:02

hover 요소 A, 표시/숨기기 요소 B

답변

관련 문제