jQuery or css slideUp/slideDown for a selectbox with size > 1 -
jQuery or css slideUp/slideDown for a selectbox with size > 1 -
jquery's slideup , slidedown don't seem selects. can wrap select in div , utilize slideup , slidedown, far effect get, result want, jerky.
with select box of size greater 1, want slide up, leaving size 1 select. (not totally hidden select.)
so appearance looking animated transition from
<select size=10> <option value="1">foo1</option> <option value="2">foo2</option> <option value="3">foo3</option> <option value="4">foo4</option> <option value="5">foo5</option> <option value="6">foo6</option> <option value="7">foo7</option> <option value="8">foo8</option> <option value="9">foo9</option> <option value="10">foo10</option> </select> to
<select> <option value=""></option> </select> being wrapped in div fine. can't smooth transition, css and/or jquery, that'll create work cleanly in chrome, ff, , opera (i don't care ie).
something want? select lists height , split number of options. gives me size of 1 alternative (directly getting alternative has 0 height btw, need calculation). utilize animate. can hover mouse on bluish box see effect.
http://jsfiddle.net/9dayv/
$('#trigger').hover( function() { var optionheight = $('select').height() / $('option').length; $('select').animate({ height: optionheight + 'px' }); }, function() { $('select').animate({ height: '100%'}); }); jquery css slidedown slideup css-transitions
Comments
Post a Comment