jquery圖像標題

Question

試圖做一個圖像標題，但不能指望「這個」對象選擇器的權利，只得到我滾過的圖像。

該標題工作正常，但懸停觸發一切。以下是我必須嘗試觸發一個，但不起作用。任何人都可以告訴我如何把正確的選擇器？

HTML

<ul id="columns"> 
     <li class="col-1"> 
      <div class="photo1"> 
        <p>I am doing great. I love this place and I would love to work here.</p> 
      </div> 
      <div class="photo2"> 
       <p>I am doing great. I love this place and I would love to work here.</p> 
      </div> 
      <div class="photo3"> 
       <p>I am doing great. I love this place and I would love to work here.</p> 
      </div> 
      <div class="photo4"></div> 
      <div class="photo5"></div> 
     </li> 
     <li class="col-2"> 
      <div class="photo6"></div> 
      <div class="photo7"></div> 
      <div class="photo8"></div> 
      <div class="photo9"></div> 
      <div class="photo10"></div> 
     </li> 
     <li class="col-3"> 
      <div class="photo11"></div> 
      <div class="photo12"></div> 
      <div class="photo13"></div> 
      <div class="photo14"></div> 
      <div class="photo15"></div> 
     </li> 
</ul> 

的DIV + CSS

.photo1 { 
     position: relative;   
     background: url(../img/sncc_teaser.jpg) no-repeat; 
     width: 250px; 
     height: 339px; 
     margin-bottom: 5px; 
    } 
ul li p { 
    display: none; 
    position: absolute; 
    background-color: gray; 
    width: 250px; 
    color: white; 
    margin: 0; 
    padding: 0; 
    padding-left: 5px; 
    bottom: 10px; 
    left: 0px; 

} 

jQuery的

$(document).ready(function(){ 
    $(".col-1").hover 
     (
      function($e) 
      { 
       $("li p", this).show(); 
      }, 

      function($e) 
      { 
       $("li p", this).hide(); 
      } 
    ); 
}); 

Answer 1

懸停，而不是整列：

$(".col-1 div").hover 
     (
      function($e) 
      { 
       $(this).find('p').show(); 
      }, 

      function($e) 
      { 
       $(this).find('p').hide(); 
      } 
    );