請從元素中選擇圖片

Question

請幫助我嗎？我想選擇'img'，菜單'li.menu_item'的光標在哪裏，有些是這樣的：$（'li.menu_item a'）。children（'img'）...，但這個不工作...我希望它在jQuery的動畫......

<ul class="menu"> 
      <li class="menu_item"><a class="selected" href="#"> domů </a></li> 
      <li class="menu_item"><a href="#"> 
       <div> 
        <img class="img_mask" src="design/btndark.png" /> 
       </div> 
       <div class="menu_mask">fotografie</div> 
      </a></li> 
      <li class="menu_item"><a class="nonselect" href="#"> 
       <div> 
        <img class="img_mask" src="design/btndark.png" /> 
       </div> 
       <div class="menu_mask"> 
        rezervace 
       </div> 
      </a></li> 
      <li class="menu_item"><a class="nonselect" href="#"> 
       <div> 
        <img class="img_mask" src="design/btndark.png" /> 
       </div> 
       <div class="menu_mask"> 
        konetakt 
       </div> 
      </a></li> 
      <li class="cl"></li> 
     </ul> 

<script type="text/javascript"> 

$(function() { 

    $('.img_mask').animate({ 
     "opacity" : .0 
    }); 

    $('li.menu_item a').hover(
     // problem je jeste v tom, ze pokud rychle prejizdim pres prvky, tak se "dopredu najedou" a kdyz jsem uz mimo obrazek, jeste blikaji... 
     // tento problem lze vyresit tim, ze zkontruluju jestli bylo animovano 
     // takze reknu funkci hover, ze nejprve ma zastavit a az pak animovat 
     function() { 
      $('.img_mask').stop().animate({ "opacity" : .8 }); 
     }, 
     function() { 
      $('.img_mask').stop().animate({ "opacity" : .0 }); 
     } 
    ); 

}); 

</script> 

Answer 1

使用this指當前正在項徘徊：

$('li.menu_item a').hover(
    function() { 
     $(this).find('.img_mask').stop().animate({ "opacity" : .8 }); 
    }, 
    function() { 
     $(this).find('.img_mask').stop().animate({ "opacity" : .0 }); 
    } 
); 

除了你似乎有嵌套在<a>標籤<div>標籤。除非您製作了<a>元素display:block或inline以外的東西，否則這是無效的。