让一个 div 在另一个 div 的鼠标悬停时淡出答案

【问题标题】：Get a div to fade out on mouse hover of another div让一个 div 在另一个 div 的鼠标悬停时淡出
【发布时间】：2015-07-17 10:08:22
【问题描述】：

我正在尝试让 .image img 在描述框悬停时淡出。

$(".description-box").on({
mouseover: function () {
    clearTimeout(timer);
    $(".image img").fadeOut();
},
mouseout : function () {
    timer = setTimeout(function () { 
        $(".image img").fadeIn();
    }, 100);
}
});

编辑

https://jsfiddle.net/pugu9vyy/

【问题讨论】：

错误是什么？另外，请向我们展示您的 HTML 代码
你能加个小提琴吗？
为什么不用css？ jsfiddle.net/5nqLkm3f/1
@Rachel Gallen 我想在该照片上设置一个 div 以触发该照片的褪色

标签： javascript jquery html css

【解决方案1】：

可能是这样的……Fiddle

$(".description-box").on({
mouseover: function () {
    timer = setTimeout(function () {
        $(".image img").fadeOut();
    }, 100);
},
mouseout: function () {
clearTimeout(timer);
    $(".image img").fadeIn();

}
});

【讨论】：

【解决方案2】：

这个怎么样：

$(".description-box").on({
    mouseenter: function () {
        $('.image img').css('opacity', '0');
    },
    mouseleave: function () {
        $('.image img').css('opacity', '1');
    }
});

见小提琴https://jsfiddle.net/pugu9vyy/1/

【讨论】：

谢谢！如果我想添加延迟，我会使用这个命令吗？ $('.image img').delay(1000).css('opacity', '0');