Custom select boxes

I've often heard that it's a Very Bad Idea to try and emulate a browser's native select box using JavaScipt, so I thought I'd give it a go to see what the fuss is all about.

Here’s a far from exhaustive list of things I found to describe how browsers seem to handle their native select boxes:

And here’s a JS Bin with my best shot. The styles are just for fun (i.e. don’t judge me) – it’s the functionality that I was interested in.

I feel like I’ve had a fairly good run at it – I think I’m relatively close to having implemented the keyboard and mouse driven idiosyncrasies.

It’s not even close to being acceptable for screenreader use, though. And I couldn’t even face attempting to handle the multiple attribute.

In any event, it’s been an interesting exercise – I’ll feel better able to defend against a custom select requirement in future.