Question

我有一个图像和一个div。如果我将鼠标悬停在图像上，则可以看到div。我想对另一个图像和div使用相同的效果。但是，如果我悬停任何图像，两个div都会显示。我怎样才能单独制作动画？这是我正在使用的代码

$(".home_plus_1 img").hover(function () {
    $(".hp_1_cont").animate({
        opacity: "1"
    }, {
        queue: false
    });
}, function () {
    $(".hp_1_cont").animate({
        opacity: "0"
    }, {
        queue: false
    });
});




<div class="home_plus_1 plus_holder"> 
<img src="<?php echo get_template_directory_uri(); ?>/images/plus.png" alt="">
  <div class="hp_1_cont">
    <div class="hp1_t">Jeden Montag, 
      Mittwoch, Samstag &
      Sonntag FKK Tage Bei uns im Club</div>
    <div class="hp_1_conb">An allen anderen Tagen treffen Sie in unseren Clubräumlichekeiten die heißen Girls in sexy Dessous an!</div>
  </div>

  <!-- hp_1_cont --> 
</div>

Answer 1

由于您没有提供任何HTML结构，我会说这样的事情会有所帮助：

$(".home_plus_1 img").hover(function () {
    $(this).next().animate({opacity: "1"}, {queue: false});
}, function () {
    $(this).next().animate({opacity: "0"}, {queue: false});
});

编辑：更新了代码以适应更新的HTML。

Answer 2

您可以使用$(this).next()或$(this).parent().find('.hp_1_cont')上下文访问元素。不要搜索所有文件上的元素

$(".home_plus_1 img").hover(function () {
    $(this).next().stop().fadeIn();
}, function () {
    $(this).next().stop().fadeOut();
});

动画最近的div

2 个答案: