javascript - Jquery - 尝试在 div 中选择图像

Question

我是 jquery 的新手，一直在尝试选择 div 中的图像。

<div class="div-main">
  <div class="title"></div>
  <div class="description"></div>
  <img class="post-thumb" src="img.jpg"/>
</div>

我试图让标题和描述仅在用户将鼠标悬停在 div 中的图像上时显示。

目前我已将其设置为当 div-main 悬停时动画发生

$(document).ready(function(){
    $(".div-main").hover(
      function () {
        $(this).children(".title").fadeIn("slow");
        $(this).children(".description").fadeIn("slow");
        $(".div-main").css({ opacity: 0.1 });
        $(this).css({ opacity: 1.0 });
        $(this).show();
      }, 
      function () {
        $(".title").hide();
        $(".description").hide();
        $(".div-main").fadeIn("fast");
        $(".div-main").css({ opacity: 1.0 });
      }
    );

});

Answer 1

jsBin demo

$(".div-main").hover(
  function () {
    $(".title, .description", this).fadeTo(300, 1);
    $(".div-main").stop().fadeTo(0, 0.3);
    $(this).fadeTo(300,1);
  },function () {
    $(".title, .description").hide();
    $(".div-main").stop().fadeTo(300, 1);
  });