I am using the jQuery Multiselect widget for many fields in an application I am currently developing. I have had to use the jQuery Position API so that at low screen resolutions the dropdowns near the bottom of the screen are displayed correctly.

 

The problem I have encountered is that when the screen resolution is set to 1920X1080 AND the browser window in maximized, all the multiselect dropdowns do not position correctly when they are opened for the first time (the dropdown menu is way offset and is positioned under the wrong control). The next time a multiselect is opened the dropdown will position correctly.

 

This only occurs at screen resolution 1920X1080 and the window maximized.

 

Here is the code I use to create my multiselects:

 

$(".multiselect-default").multiselect({
     selectedList: 1,
     noneSelectedText: '-'
     position: ({
        my: "center top",
        at: "center bottom",
        collision: 'flipfit',
        within: window
    })
});

 

Any ideas on this would be greatly appreciated.

Regards.