2013-10-03 108 views
0

我想要做的是使頁面下方的頁面導航按鈕隱藏,當鼠標懸停在屏幕的底部三分之上時,向上滑動。當鼠標懸停在屏幕底部時,您如何顯示隱藏的div?

我曾嘗試通過在頁面底部製作一個固定的不可見的div,然後每當鼠標懸停在該div分頁將出現時。但是,有一個問題。因爲div覆蓋了它下面的文本,所以您不能點擊該div下的鏈接。

那麼還有另一種方法來完成我的意圖嗎?也許使用鼠標的y座標通過jQuery而不是在頁面上使用div?謝謝。

+1

沒錯。你已經回答了你自己。 – leon

+0

你是對的,我想通了:) – anita

+0

你去... – leon

回答

1

我擺脫了div,而是把它放到我的jquery文件中。

$(window).mousemove(function(e) { 

    var mouseY = e.pageY - $(window).scrollTop(); // mouse y coordinate relative to window 

    if (mouseY > 500) { 
     $('#pagination').show().stop().transition({y:-80}, 500, 'snap'); // slide pagination up 
    } else { 
     $('#pagination').stop().transition({y:+80}, 1000, 'snap'); // slide pagination down 
    } 

}); 

注:我用http://ricostacruz.com/jquery.transit/的過渡

0

你試圖將工作的解決方案 - 只需添加

pointer-events:none; 

到固定div的CSS! :)

+0

嗯..當我這樣做,導航不再出現? – anita

相關問題