僅當鼠標沿垂直方向移動時才觸發mouseleave事件

我有一個用作主導航的ul。我在裏面有一個李，當它徘徊的時候，用一堆信息滑下一個隱藏的div。這個div出現在主導航下面。如果用戶在主導航之外垂直移動鼠標，我想讓div隱藏自己。我需要它留下來，如果他們將鼠標移動到div上，以便他們可以點擊位於那裏的鏈接。僅當鼠標沿垂直方向移動時才觸發mouseleave事件

下面是一些代碼：

<ul> 
<li> <a href="#">item one </a></li> 
<li id="locations"> <a href="#">item two </a> </li>  
<li> <a href="#">item three </a> </li> 
</ul> 

<div id="superNav"> div content is here </div>

這是當前的jQuery：

$('li#locations a').hover(function(){ 
$('#locationsSuperNav').slideDown(); 
}); 
$('#locationsSuperNav').mouseleave(function(){ 
$(this).slideUp(); 
});

有沒有辦法使用y座標也引發MouseLeave事件？

在此先感謝您的幫助。

來源

2010-09-10 Mike Muller

只需爲mouseleave創建一個函數，然後在你的li的mouseleave上調用該函數，也可以爲其他事件調用該函數。

一個方法可以使用http://api.jquery.com/event.pageY/。但是這有點合編。

另一種方法是將鼠標放置在允許鼠標移動的區域（幻燈片保持觸發的位置）放入透明區域，並在mouseleave中調用「mouseleave函數」（來自帖子的第一段）這個透明div的事件。

來源

2010-09-10 16:12:51 cripox

var y = 0; 
$(document).ready(function() { 
    $('#locations a').hover(function(e){ 
    y = e.pageY; 
    $('#superNav').slideUp(); 
    },function(e){ 
    if(Math.abs(e.pageY - y) > 0) { 
     $('#superNav').slideDown(); 
    } 
    }); 
});

這裏有一個演示，上面的代碼http://jsbin.com/axane3

來源

2010-09-10 16:16:23

僅當鼠標沿垂直方向移動時才觸發mouseleave事件

回答

相關問題