$(document).ready(function() {
var mx, my, anime = false;
var e_top = $('.panel-dock').css('top').split('px')[0]
var e_bottom = $('.panel-dock').css('height').split('px')[0]
e_top = parseFloat(e_top)
e_bottom = parseFloat(e_bottom)
$(document).mousemove(function(e) {
if (anime) {
return;
}
mx = parseFloat(e.clientX);
my = parseFloat(e.clientY);
console.log(my, e_top, e_bottom)
if (mx <= 80) {
//if (my >= e_top && my <= e_bottom) {
anime = true;
$('.panel-dock').animate({
left: 0,
}, 'fast', function() {
anime = false;
});
//}
} else if (mx > 80) {
//if (my < e_top && my > e_bottom) {
anime = true;
$('.panel-dock').animate({
left: -60,
}, 'slow', function() {
anime = false;
});
//}
}
});
});
当我删除条件if (my>=e_top && my<=e_bottom)和if (my<e_top && my>e_bottom). 并且,如果鼠标进入mx <= 80面板内的任何地方都是可见的;否则,它会慢慢隐藏。
如果鼠标距左侧 80 像素以内且位于面板的起始位置与其高度之间,我想显示此面板。
$(document).ready(function() {
var mx, my, anime = false;
var e_top = $('.panel').css('top').split('px')[0]
var e_bottom = $('.panel').css('bottom').split('px')[0]
$(document).mousemove(function(e) {
if (anime) {
return;
}
mx = e.clientX;
my = e.clientY;
// console.log(my, e_top, e_bottom)
if (mx<=80) {
if (my>=e_top && my<=e_bottom) {
anime = true;
$('.panel').animate({
left: '0',
}, 'fast', function () {
anime = false;
});
}
} else if (mx > 80) {
if (my<e_top && my>e_bottom) {
anime = true;
$('.panel').animate({
left: '-60',
}, 'slow', function () {
anime = false;
});
}
}
});
});
那么,有什么解决办法吗?
相关分类