|
|
Iam trying to get horizontal scroll bar for drop down box using HTML,css and javaScript, when value in drop down is toolarge.
If any body know the solution, it will be greate help to me.
Thanks a lot.
|
|
|
|
I assume by "drop down" you are referring to the HTML <SELECT> element. By default a <SELECT> element will horizontally (left to right) size to fit your contents. The vertical size is normally controlled using the "size" parameter. For example, to show 5 options at a time, <select name=MyOptions size=5>. The vertical scroll bar is automatic. There is not an option for a horizontal scroll bar in a SELECT.
So you must be forcing the width of the <SELECT> to be less than your contents. If so, your options will be cutoff -- no option for horizontal scrolling.
The "solution" would be to roll your own method for allowing the user to select the option(s). One idea is to use a popup window where you code your own scrollable list of options as a stand-alone HTML page. When the user selects an option, you pass back that value to the parent window. This is much more involved than simply using a <SELECT> of course, but if you want to do non-default things, you'll have to code for it.
Hope this helps, Kris.
|
|
|
|
|
|
Thank you..Troy Wolf
Can I create horizontal scroll bar using javaScript for html <select> element?
I appreciate you help if you have any example code or just an idea.
Iam a java programmer and i know little about javaScipt.
Thanks a lot.
|
|
|
|
You cannot add a horizontal scroll bar to an HTML <SELECT> element. This is why I said your options are to "roll your own".
The two methods you'll want to look at are.
1) Write a stand-alone HTML page (of course could be generated server-side by ASP,PHP,CGI,JSP,CF, etc.). This page will be the scrollable list of options. Then have your page where you need the user to select an option pop a smaller window with this page in it. Script it so that when the user selects an option from the popup, that value is passed back to the parent page and the popup window is automatically closed.
2) DHTML menus. There are ways to generate objects that appear similar to a <SELECT> using scrollable <DIV>s and styles to make them appear and dissappear as needed. These can be very cool, but making them 100% cross-browser is a challenge for the best javascripters out there. There are examples out there you can leverage.
|
|
|
|
|
|
Thank you for your time..I will going to try now.
|
|
|
|
|
|
|
|
Thanks lot for work around.
|
|
|
|
hi,
can u tell me how to add scroll bar for the listbox using javascript,css,html.
Can plz share the code
|
|
|
|
Hello,
I have joined this site purely to add this comment (as this is the no.1 Google result for this issue and it has remained unanswered since 2003!!)
Simply add the following DIV tag around the SELECT box and you will get a scroller:
<div style="overflow-x:scroll; width:500px;
overflow: -moz-scrollbars-horizontal;">
<select....></select>
</div>
Thanks,
Alastair
http://www.Txtlocal.com
|
|
|
|
|
|
|
Kris123
Troy Wolf
