This is a quick example of delegating the focus and blur events. I haven't bothered to write a dropdown menu; this is just a proof of concept.
Try accessing the menu by mouse and keyboard: all events are defined and handled on the top <ol>.
Events:
function init() {
var el = $('test');
// all browsers
el.onmouseover = handleEvent;
el.onmouseout = handleEvent;
// IE
el.onfocusin = handleEvent;
el.onfocusout = handleEvent;
// FF, Saf, Op
if (el.addEventListener) {
el.addEventListener('focus',handleEvent,true);
el.addEventListener('blur',handleEvent,true);
}
}