By using this site, you agree to our updated Privacy Policy and our Terms of Use. Manage your Cookies Settings.
458,028 Members | 1,309 Online
Bytes IT Community
+ Ask a Question
Need help? Post your question and get tips & solutions from a community of 458,028 IT Pros & Developers. It's quick & easy.

Struggling with listbox height

P: 1
Hello all, I found a slight problem that is puzzling me

What I want,
- When I have a drop down box on a screen it should be size=1.
- When I click on the drop down box, ALL values should be displayed
- When I click on a value in the drop down box, the value should be selected and the drop down box should close (to size=1)

The above works great if there are 11 or less items in your drop down box. If there are more then a scrollbar will be shown on the right side. I do not wish the scrollbar to appear, I want to show all values without the need to scroll.

I managed a sorta workaround but I lose the functionality of the drop down box, that the values of the drop down box appear above the screen without altering the layout of the screen.
So I want best of both worlds: all values should appear in the dropped down box when I click on it without altering the layout of the page it is on
I can best explain it with my examples:

Expand|Select|Wrap|Line Numbers
  1. <html>
  2. <body>
  3. <form action="">
  4. TEST1
  5. <select name="cars" >  
  6.   <option value=" "> </option>
  7.   <option value="volvo">Volvo</option>
  8.   <option value="saab">Saab</option>
  9.   <option value="fiat">Fiat</option>
  10.   <option value="audi">Audi</option>
  11.   <option value="audi">Audi2</option>
  12.   <option value="audi">Audi3</option>
  13.   <option value="audi">Audi4</option>
  14.   <option value="audi">Audi5</option>
  15.   <option value="audi">Audi6</option>
  16.   <option value="audi">Audi7</option>
  17.   <option value="audi">Audi8</option>
  18.   <option value="audi">Audi9</option>
  19.   <option value="audi">Audi10</option>
  20.   <option value="audi">Audi11</option>
  21.   <option value="audi">Audi12</option>
  22. </select></p>
  23. TEST2
  25. <select name="cars" onClick="size=1" onMouseOver="size=16" onMouseOut="size=1"
  26.    >  
  27.   <option value=" "> </option>
  28.   <option value="volvo">Volvo</option>
  29.   <option value="saab">Saab</option>
  30.   <option value="fiat">Fiat</option>
  31.   <option value="audi">Audi</option>
  32.   <option value="audi">Audi2</option>
  33.   <option value="audi">Audi3</option>
  34.   <option value="audi">Audi4</option>
  35.   <option value="audi">Audi5</option>
  36.   <option value="audi">Audi6</option>
  37.   <option value="audi">Audi7</option>
  38.   <option value="audi">Audi8</option>
  39.   <option value="audi">Audi9</option>
  40.   <option value="audi">Audi10</option>
  41.   <option value="audi">Audi11</option>
  42.   <option value="audi">Audi12</option>
  43. </select></p>
  44. </form>
Apr 2 '08 #1
Share this Question
Share on Google+
2 Replies

Expert 100+
P: 971
This is an issue with the onMouse function not an HTML issue. Moving thread to JavaScript.

Apr 3 '08 #2

Expert 100+
P: 1,654

See if this works...
Apr 3 '08 #3

Post your reply

Sign in to post your reply or Sign up for a free account.