0

I am trying to show 5 items in dropdownlist and add a scroll bar after that records. I tried adding height etc to select and could not succeed. Even size property is not what I am looking for. Do we have any property to set height of dropdown list and add scroll after showing certain number of records?

dropdown list 

<select>
    <option>1</option>
    <option>2</option>
    <option>3</option>
    <option>4</option>
    <option>5</option>
    <option>6</option>
     <option>1</option>
    <option>2</option>
    <option>3</option>
    <option>4</option>
    <option>5</option>
    <option>6</option>
    <option>1</option>
    <option>2</option>
    <option>3</option>
    <option>4</option>
    <option>5</option>
    <option>6</option>
</select>
Kurkula
  • 6,386
  • 27
  • 127
  • 202
  • possible duplicate of [html select scroll bar](http://stackoverflow.com/questions/901089/html-select-scroll-bar) – showdev Jan 17 '14 at 20:40
  • 2
    You'll need jquery for this. I've used the select2 plugin for this before. http://ivaynberg.github.io/select2/ – Aaron Jan 17 '14 at 20:44

2 Answers2

3
<select onmousedown="if(this.options.length>8){this.size=5;}"  onchange='this.size=0;' onblur="this.size=0;">
    <option>1</option>
    <option>2</option>
    <option>3</option>
    <option>4</option>
    <option>5</option>
    <option>6</option>
     <option>1</option>
    <option>2</option>
    <option>3</option>
    <option>4</option>
    <option>5</option>
    <option>6</option>
    <option>1</option>
    <option>2</option>
    <option>3</option>
    <option>4</option>
    <option>5</option>
    <option>6</option>
</select>

Test Here

Tariq
  • 390
  • 1
  • 9
2

Pretty sure that's operating system/browser behavior that cannot be changed.

Here are some similar questions with the same responses... and I'm not aware of any recent HTML/CSS tricks to do it either.

Community
  • 1
  • 1
sachleen
  • 30,730
  • 8
  • 78
  • 73