JQuery鼠标悬停问题

Question

我使用以下脚本,并有占位符div.当我鼠标悬停时,div播放按钮应该超过占位符.

我连续三个占位符.当鼠标悬停在一个特定的占位符上时,会出现所有播放按钮.我需要的是当鼠标悬停在占位符上时,只显示播放图像.

希望你能理解我的问题.有人可以帮我这样做吗？

jQuery.noConflict();
       jQuery(function(){
        jQuery('.placeholder').mouseover(function(){
               jQuery('.play').show('show');
        });
        jQuery('.placeholder').mouseleave(function(){
               jQuery('.play').hide('hide');
        });
      });

HTML:

 <div class="placeholder item"><div class="play"><img src="images/play_ico.jpg"></div></div>
 <div class="placeholder item"><div class="play"><img src="images/play_ico.jpg"></div></div>
 <div class="placeholder item"><div class="play"><img src="images/play_ico.jpg"></div></div>

CSS:

.placeholder{
    width:120px;
    float:left;
    background:#ccc;
    height:67px;
    position:relative;
}

.play{
    width:120px;
    height:67px;
    position:absolute;
    top:0;
    left:0;
    display:none;
    background:#000;
    opacity:0.4;
filter:alpha(opacity=40);
}

Answer 1

请尝试以下方法:

    jQuery('.placeholder').mouseenter(function(){
           jQuery(this).find('.play').show();
    });
    jQuery('.placeholder').mouseleave(function(){
           jQuery(this).find('.play').hide();
    });

作为替代方案,您可以使用hover方法:

    jQuery('.placeholder').hover(function() {
           jQuery(this).find('.play').show();
    }, function() {
           jQuery(this).find('.play').hide();
    })