Prevent listbox from scrolling to the item getting selected (with jquery)

Question

I have a listbox, with items that can be in some kind of group with other items. When one item is selected, all items from the group are selected with jquery.

Its really annoying that the listbox scrolls down to the items that jquery is selecting. I want to stay at the position of the item selected by the user.

So how can i prevent the listbox from scrolling down when items get selected?

jsfiddle example here: example

EDIT: click on item number 10 in the example, and he goes to 78, thats the issue here.

Answer 1

You can try this:

$('#lb').change(function() { 

    var x = $(this).scrollTop();

    $('#lb option:selected').each(function() { 
        var groupName = $(this).attr('group'); 
        if (groupName !== undefined) { 
            $('#lb option[group=' + groupName + ']').each(function() { 
                this.selected = true; 
            }); 
        }

    }); 

     $(this).scrollTop(x); 
} );