gfranko/jquery.selectBoxIt.js — pull request #234 by boblauer (2014-01-10 19:21:56+00:00)
Title: Mimic native select's outline on focus of selectBox

When a native select box is focused, it will be given an outline. For example, a blue outer glow in Chrome:

![image](https://f.cloud.github.com/assets/824632/1890219/66de2878-7a29-11e3-8842-8a23f9160eae.png)

and a dotted line in Firefox:

![image](https://f.cloud.github.com/assets/824632/1890227/7cb8e6b0-7a29-11e3-8b57-1833e888d97b.png)

What this pull request does is when the page loads, it adds a hidden select list to the page, sets focus on it, grabs its outline style, and then removes it from the DOM. It then applies that style to the selectBox any time is receives focus. As an example:

![image](https://f.cloud.github.com/assets/824632/1890249/cc4280d8-7a29-11e3-806f-feb41f7fb808.png)

You can see that the style isn't perfect, as it doesn't hug the edge of the control quite as tight as the native select, but I still believe it's better than nothing. It makes it feel much more like a native control.

2 other things:

When performing the following events:
- Tab onto a selectBox (in fact, don't touch your mouse for this entire process)
- Use the down arrow to highlight a value
- Press enter to select a value and close the list
- Tab to the next element.

The selectBox that was tabbed off still has `isBlur` set to false, and so the focus outline was still visible when it shouldn't be. This is because `isBlur` is usually set to false on the mouseout event, but that event doesn't fired if the mouse never moves. To fix this, I set `isBlur` to true inside the `change.selectBoxIt` handler, on line 1534.

Also, I'm unsure how to write a unit test for this. I was hoping either you could guide me in the right direction, or if you were more comfortable writing the test, I'd be fine with that as well.

Thanks!