jquery/javascript: ie float doesn't cover name box options?

i have bit book dilate calm box mouseover digest mouseoff.

the problem i am carrying internet path-finder doesn't seem extend it's float over options name box.

this means ie i click select, have options dump down, nonetheless i try name one, disappear name box re-sizes shortly i pierce off name box itself.

example code:

<script type='text/javascript'>
$(function() {
$('#theselect').hover(
    function(e){
        $('#thetext').val('over');
        $(this).width( 600 );
    },
    function(e){
        $('#thetext').val('out');
        $(this).width( 50 );
   }
);
});
</script>

and:

<input type='text' id='thetext' /><br /><br />

<select id='theselect' style='width:50px;'>
    <option value='1'>one</option>
    <option value='2'>two</option>
    <option value='3'>three</option>
    <option value='42,693,748,756'>forty-two billion, six-hundred ninety-three million, seven-hundred-forty-some-odd..... </option>
    <option value='5'>five</option>
    <option value='6'>six</option>
    <option value='7'>seven...</option>
</select>

are there any workarounds name boxes ie? i even cruise jquery deputy anyone advise unequivocally reliable.

thanks!