2

我正在使用以下脚本，并且有占位符 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);
}
4

3 回答 3

5

尝试以下操作：

    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();
    })
于 2012-07-27T20:13:30.163 回答
2

你确定你做对了，你真的需要使用 noConflict 吗？

jQuery(function(){
    jQuery('.placeholder').on({
        mouseenter: function(){
           jQuery('.play', this).show('slow');
        },
        mouseleave: function() {
           jQuery('.play', this).hide('slow');
        }
    });
});

要不就

jQuery('.placeholder').on('mouseenter mouseleave', function() {
    jQuery('.play', this).toggle();
});
于 2012-07-27T20:15:15.547 回答
0

在我的脑海中，我不认为“显示”和“隐藏”是传递给显示和隐藏函数的有效参数，除非您使用这些名称的自定义动画？

试试看

jQuery('.play').show();

和

jQuery('.play').hide();

除非您希望它们进出动画，否则请使用

jQuery('.play').show('slow');

和

jQuery('.play').hide('slow');

或等价物:)

http://api.jquery.com/show/

于 2012-07-27T20:14:16.003 回答