[reedit基于评论] jsfiddle修订,删除了css-only解决方案.诀窍是监视滑动元素的悬停状态并使用超时允许用户在滑动元素上移动(另请参阅更新的jsfiddle中的注释).
来自OPs jsfiddle @here的jsfiddle
使用#ids的悬停功能:
function hover(e){
e = e || event;
var el = e.target || e.srcElement
,showel = $('#dvNotifications')
;
if (!/NotificationSummary/i.test(el.id)) {
showel .attr('data-ishovered',/over/i.test(e.type));
} else {
showel .attr('data-ishovered',false)
}
if (/true/i.test(showel .attr('data-ishovered'))){return true;}
if (/over$/i.test(e.type) && /NotificationSummary/i.test(el.id)){
showel .slideDown();
} else {
setTimeout(function(){
if (/false/i.test(showel .attr('data-ishovered'))) {
showel .slideUp();
showel .attr('data-ishovered',false);
}
}
,200);
}
}