|
|
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
|
|
|
|
|
|
|
|
I too have joined this page especially to post a comment here, as it is the number 1 search result in Google, to say:
AAAAAAAARRRRRRRRGGGGGGGGGGGGGGGHHHHHHHH, non-standard browser-specific hacks!
*runs away wildly waving arms*
*then...*
*slowly tip-toes back, and whispers:*
The CSS3 bit (overflow-x) is cool - but gotta wait for it to be more widely supported.
|
|
|
|
Firstly, you do not explain whether you are trying to do this through a web page. I will assume you are, by the title of your post.
Unfortunately I do not have time to help with the code, but would offer the following pointers auto insurance quotes.
Your question involves not so much Javascript, but the "Microsoft Word Object Model", so is only partially relevant to this forum.
Nevertheless here are your avenues of further enquiry:-
1. Microsoft Word Object Model
This object model is part of Microsoft Word (not Javascript) and it lets you "automate" word remotely from other programs (not just web pages, but any computer program).
It is primarily designed for Visual Basic, but can be accessed by Javascript from a web page - see para 2 below home based business.
However it is a bit more tricky to use through Javascript, particularly because you cannot use visual basic constants - you need to refer to them by value. If you research this further, you will soon know what I mean by this.
So where can you find out about this Object Model?
It is all there in the Word help files if you look for it.
If you look in the Word help, under programming information, you will find the Microsoft Word Visual Basic Programming Reference.
The Word object model, which lets you do things you will need to solve your problem like:-
- Open Word
- Open a Document in Word
- Access the collection of Tables in that ActiveDocument.
- Access the Rows and Cells of a given Table.
2. How do you access this from Javascript?
This can only be done I think through Internet Explorer (and perhaps Opera).
Here you need to learn about ActiveXObjects stored value debit cards.
ActiveXObjects (if you do not know) are separate computer programs which enable additional functionality. There are lots of ActiveX objects on the internet.
When you install Word, this also installs an ActiveX object for automating word, giving you access to the Word Object Model.
So in javascript, lets open up a new instance of word:-
var oApplication=new ActiveXObject("Word.Application");
oApplication.Visible=true; // "Visible" is in the Word Object Model
There you have it.
Then if you want to open you file and get the table:-
oApplication.Documents.Open("myfilename");
var oDocument=oApplication.ActiveDocument;
var oTable=oDocument.Tables(1);
creditcard
|
|
|
|
|
|
|
|
Kris123
Troy Wolf
