Css select drop down menu issue with ie9

Question

I am having an issue with drop down menu in ie9. The below code is working fine for me. But on ie9 i have to click twice on the dd menu to see the options.

any solution for ie9?

<script type='text/javascript'>
    function SetWidthToAuto(drpLst) {
        drpLst.style.width = 'auto';
    }

    function ResetWidth(drpLst) {
        drpLst.style.width = '150px';
    }
    </script>

    <div style="width:150px;overflow:hidden;">
    <select id="drpTechnology" style='width:150px' onchange='ResetWidth(this)'
    onblur='ResetWidth(this)'
    onmousedown='SetWidthToAuto(this)'>
    <option value="-1">Browse me..</option>
    <option value="1">Short Option</option>
    <option value="2">Little bigger than short Option</option>
    <option value="3">Largest option available with this select box</option>
    </select>
    <div>

Thanks

Answer 1

Just replace onmousedown by onclick .

You can also remove this in the function calls and simply use this inside the functions.

Try the JSfiddle: http://jsfiddle.net/d2UUs/1