Javascript 将hoverintent添加到此jquery代码段

有没有办法将hoverinter添加到此jquery代码段中？当前，如果将鼠标悬停在具有“wall block content”类的周围元素上，它们都会淡入/淡出

$(".wall-block-content").fadeTo("fast", 0);

$(".wall-block-content").hover(function(){
$(this).fadeTo("fast", 1);
},function(){
$(this).fadeTo("fast", 0);
});

改为使用“方法”，使其更加坚实，您可以像这样改进动画：

更新：您可以创建一个带有透明背景的假元素，然后使用它触发目标元素的动画

$(".hidden").hover(function(){
    $('.target').stop().animate({'opacity':'1','margin-top':'0px'},100);
},function(){
    $('.target').stop().animate({'opacity':'0','margin-top':'20px'},100);
});

<div id="wrapper">
    <div class="target posi"></div>
    <div class="hidden posi"></div>
</div>

#wrapper { position:relative; left:0; top:0; } 
    .posi { position:absolute; left:100px; top:100px; width:200px; height:200px;}
        .hidden { background:transparent; cursor:pointer; }
        .target {background:red; opacity:0;}

$（.hidden”）.hover（函数（）{
$（'.target'）.stop（）.animate（{'opacity'：'1'，'margin-top'：'0px'}，100）；
}，函数（）{
$（'.target'）.stop（）.animate（{'opacity'：'0'，'margin-top'：'20px'}，100）；
});
#包装器{position:relative；left:0；top:0；}
.posi{位置：绝对；左：100px；顶部：100px；宽度：200px；高度：200px；}
.hidden{背景：透明；光标：指针；}
.target{背景：红色；不透明度：0；}

使用计时器实现目的：

---

在本例中，用户必须将鼠标悬停在元素上至少1秒（1000毫秒）才能显示意图。Barlas是正确的，但是使用动画更干净。

您可以展示一个“使用墙块内容类包围元素”的示例吗？可能会包括一个简单的JSFIDLE事件，这很好，但是有没有办法隐藏.wall block内容div直到有人悬停在它上面？@DeanElliott我已经更新了我的答案，请查看JSFIDLE。你的第一个解决方案是完美的，除了我只需要在页面加载时隐藏.wall block内容div…@DeanElliott

$（document）.ready（function（$（'.myEle'）.hide（）；）；

或者您可以使用

css

？我很难理解您的意思（：@DeanElliott您可以创建一个与目标元素位置完全相同的伪元素。然后使用此伪元素触发鼠标悬停动画。请仔细输入我的更新答案。

target=.wall block content

和

hidden=伪元素

$(".wall-block-content").hover(function(){
    var $this = $(this),
        timer = $this.data("timer");

    if(timer) window.clearTimeout(timer);
    timer = window.setTimeout(function () {
        $this.stop().animate({'opacity':'0'},100);
    }, 1000);
    $this.data("timer", timer);
},function(){
    var $this = $(this),
        timer = $this.data("timer");

    if(timer) window.clearTimeout(timer);
     $this.stop().animate({'opacity':'1'},100);
});