1 
<div class="container4" style="position: relative; left: 0px; top: 0px; width: 80px; height: 90px; border: solid 1px black;" onmouseenter="this.style.border='solid 3px red';" onmouseleave="this.style.border='solid 1px black';" onclick="this.style.background='rgba(0, 0, 0, 0.5)';" oncontextmenu="return false;"></div>

http://jsfiddle.net/X4NXf/1/

特定のクラスの div に対する onmouseleave アクションの単純な遅延が必要です。

可能であれば、遅延アクションがトリガーされる前に div に再度入ると、その遅延アクションをキャンセルし、再び div を離れた後に (最初から遅延を開始して) 再び開始する必要があります。

好ましい解決策はjquery関数ですが、他のアプローチにも対応しています。

4

1 に答える 1

1

jQuery を試す

$('.container4').mouseenter(function(){
    var $this =  $(this);
    clearTimeout($this.data('timerMouseleave'));
    $this.css('border', 'solid 3px red')
}).mouseleave(function(){
    var $this =  $(this);
    var timer = setTimeout($.proxy(function(){
        $this.css('border', 'solid 1px black')
    }, this), 2000)
    $this.data('timerMouseleave', timer)
})

デモ:フィドル

于 2013-08-24T11:44:55.427 に答える