IE6, IE7, Safari (Windows) have an issue with the scrollbar. When clicking to scroll, the menu disappears.

Here’s the function, i modified. Perhaps it’s usefull for someone:

function getSelectOptions(parentid) {
var select_options = new Array();
var ul = document.createElement(’ul’);
$select.children(’option’).each(function() {
var li = document.createElement(’li’);
li.setAttribute(’id’, parentid + ‘_’ + $(this).val());
li.innerHTML = $(this).html();
if ($(this).is(’:selected’)) {
$input.val($(this).html());
$(li).addClass(opt.hoverClass);
}
ul.appendChild(li);
$(li)
.mouseover(function(event) {
hasfocus = 1;
if (opt.debug) console.log(’out on : ‘+this.id);
jQuery(event.target, $container).addClass(opt.hoverClass);
})
.mouseout(function(event) {
hasfocus = -1;
if (opt.debug) console.log(’out on : ‘+this.id);
jQuery(event.target, $container).removeClass(opt.hoverClass);
})
.click(function(event) {
if (opt.debug) console.log(’click on :’+this.id);
$(’.'+opt.hoverClass).removeClass(opt.hoverClass); // ADDED: removes all “select”-classes, so the clicked Element is the only “selected” one.
$(this).addClass(opt.hoverClass);
setCurrent();
hideMe();
});
});
return ul;
}

I added the “esc” key to the keyCode switch statement so the menu disappears when a user presses “esc.”

case 27: // esc
hideMe();
break;

My request is to have the ability to use the keyboard to jump to the different options in the drop down menu. I’ve only seen this done on one other plugin (http://dev.jquery.com/~cbach/demos/selectbox/) which works in Firefox but breaks in IE6+. It would be great if you could add this functionality.

On a side note, I’ll see what I can do about fixing the Mac “enter” bug. I haven’t had much luck so far.

@kevin : hmm I think you should format and reinstall your windows ;-). ok, seriously can you send a screenshot because I’ve just tested with IE6 windows & linux using wine , FF2 win & linux and it just works fine with me

FF2: Can’t click and select the first option. Selecting any option doesn’t update the drop down box with the value.

IE6: Scrollbar doesnt appear.

IE7: Clicking the scrollbar in the dropdown makes it vanish altogether.

May be you’ll find useful such ideas:

var hasfocus = 0;
var mouseOverOnContainer = 0; //added

…..

$container.addClass(options.containerClass);
//next lines added to process correctly scrolling of container with help of scrollbars
$container.mouseover(function(){mouseOverOnContainer = true; }); $container.mouseout(function(){mouseOverOnContainer = false; });
//return focus to input, because blur handler should work
$container.scroll(function(){$input.focus();});

…..

// || mouseOverOnContainer added
.blur(function() {
if ($container.is(’:visible’) && (hasfocus > 0 || mouseOverOnContainer)) {

Good luck.

I was using your plugin, thx.
It works not very good under Mac/Safari2.0.2 (multi-safari installation) at least, I was not tested deeply. I have selectbox wrapper limited by height with overflow-x:hidden, navigation through options by scroll button. Selection was working incorrectly.
This fix helpt me. Hope it will be useful.

.click(function(event) {
if (opt.debug) console.log(’click on :’+this.id);
//next line was added
$(’LI’, $container).removeClass(opt.hoverClass);
$(this).addClass(opt.hoverClass);

Good luck.