468,244 Members | 2,021 Online
Bytes | Developer Community
New Post

Home Posts Topics Members FAQ

Post your question to a community of 468,244 developers. It's quick & easy.

ALT function on <SELECT> option

Hi!, I want to fix via javascript the combo width to a fix value. I'd
like to implement a kind of ALT / TITLE function to show the entire
option when the text is longer than the combo width...
It's possible?!?
Thanks
Jul 23 '05 #1
3 15924


gekoblu wrote:
Hi!, I want to fix via javascript the combo width to a fix value. I'd
like to implement a kind of ALT / TITLE function to show the entire
option when the text is longer than the combo width...
It's possible?!?


You can set the width with CSS, you can set the title attribute as a
property with javascript:

<html lang="en">
<head>
<title>setting title of select element</title>
<script type="text/javascript">
function setTitleToSelectedText (select) {
if (select.selectedIndex > -1) {
select.title = select.options[select.selectedIndex].text;
}
}
</script>
<style type="text/css">
select {
width: 100px;
}
</style>
</head>
<body>
<form name="formName" action="">
<p>
<select name="select1" onchange="setTitleToSelectedText(this);">
<option>option 1 option 1 option 1</option>
<option>option 2 option 2 option 2</option>
<option>option 3 option 3 option 3</option>
</select>
</p>
<p>
<select name="select2" onchange="setTitleToSelectedText(this);" size="3">
<option>option 1 option 1 option 1</option>
<option>option 2 option 2 option 2</option>
<option>option 3 option 3 option 3</option>
</select>
</p>
</form>
<script type="text/javascript">
setTitleToSelectedText(document.forms.formName.ele ments.select1);
setTitleToSelectedText(document.forms.formName.ele ments.select2);
</script>
</body>
</html>

Note however that IE/Win doesn't support this (title attribute/property
of <select> elements), but Mozilla, Netscape 6/7, Opera 7 do
--

Martin Honnen
http://JavaScript.FAQTs.com/

Jul 23 '05 #2
Thanks Martin, unfortunately I had to use IE 6...
another problem is: if I fix the combo width, also the drop down menu
is resized and if the option is longer, it will be cutted!
I'd like a 'title' for each option even in the drop down, even befor a
select action... Do you think I'm wondering the moon?!? :-)
Martin Honnen <ma*******@yahoo.de> wrote in message news:<40********@olaf.komtel.net>...
gekoblu wrote:
Hi!, I want to fix via javascript the combo width to a fix value. I'd
like to implement a kind of ALT / TITLE function to show the entire
option when the text is longer than the combo width...
It's possible?!?


You can set the width with CSS, you can set the title attribute as a
property with javascript:

<html lang="en">
<head>
<title>setting title of select element</title>
<script type="text/javascript">
function setTitleToSelectedText (select) {
if (select.selectedIndex > -1) {
select.title = select.options[select.selectedIndex].text;
}
}
</script>
<style type="text/css">
select {
width: 100px;
}
</style>
</head>
<body>
<form name="formName" action="">
<p>
<select name="select1" onchange="setTitleToSelectedText(this);">
<option>option 1 option 1 option 1</option>
<option>option 2 option 2 option 2</option>
<option>option 3 option 3 option 3</option>
</select>
</p>
<p>
<select name="select2" onchange="setTitleToSelectedText(this);" size="3">
<option>option 1 option 1 option 1</option>
<option>option 2 option 2 option 2</option>
<option>option 3 option 3 option 3</option>
</select>
</p>
</form>
<script type="text/javascript">
setTitleToSelectedText(document.forms.formName.ele ments.select1);
setTitleToSelectedText(document.forms.formName.ele ments.select2);
</script>
</body>
</html>

Note however that IE/Win doesn't support this (title attribute/property
of <select> elements), but Mozilla, Netscape 6/7, Opera 7 do

Jul 23 '05 #3
In IE 6, one way that you have to display the complete option
is to put (via javascript) a title on the word that you have sitting
next to the SELECT element saying what it is (like Choices:). Then
IF the user thinks to put hir mouse over that word, he could find out
what the complete option is. However, this still won't do what you're
asking for (where there is a title as you hilight a choice before
selection).

Csaba Gabor

"gekoblu" <ge*****@tiscali.it> wrote in message
news:47**************************@posting.google.c om...
Thanks Martin, unfortunately I had to use IE 6...
another problem is: if I fix the combo width, also the drop down menu
is resized and if the option is longer, it will be cutted!
I'd like a 'title' for each option even in the drop down, even befor a
select action... Do you think I'm wondering the moon?!? :-)
Martin Honnen <ma*******@yahoo.de> wrote in message

news:<40********@olaf.komtel.net>...
gekoblu wrote:
Hi!, I want to fix via javascript the combo width to a fix value. I'd
like to implement a kind of ALT / TITLE function to show the entire
option when the text is longer than the combo width...
It's possible?!?


You can set the width with CSS, you can set the title attribute as a
property with javascript:

<html lang="en">
<head>
<title>setting title of select element</title>
<script type="text/javascript">
function setTitleToSelectedText (select) {
if (select.selectedIndex > -1) {
select.title = select.options[select.selectedIndex].text;
}
}
</script>
<style type="text/css">
select {
width: 100px;
}
</style>
</head>
<body>
<form name="formName" action="">
<p>
<select name="select1" onchange="setTitleToSelectedText(this);">
<option>option 1 option 1 option 1</option>
<option>option 2 option 2 option 2</option>
<option>option 3 option 3 option 3</option>
</select>
</p>
<p>
<select name="select2" onchange="setTitleToSelectedText(this);" size="3"> <option>option 1 option 1 option 1</option>
<option>option 2 option 2 option 2</option>
<option>option 3 option 3 option 3</option>
</select>
</p>
</form>
<script type="text/javascript">
setTitleToSelectedText(document.forms.formName.ele ments.select1);
setTitleToSelectedText(document.forms.formName.ele ments.select2);
</script>
</body>
</html>

Note however that IE/Win doesn't support this (title attribute/property
of <select> elements), but Mozilla, Netscape 6/7, Opera 7 do

Jul 23 '05 #4

This discussion thread is closed

Replies have been disabled for this discussion.

Similar topics

6 posts views Thread by Chris Fink | last post: by
3 posts views Thread by i_dvlp | last post: by
5 posts views Thread by = poster = | last post: by
reply views Thread by NPC403 | last post: by
reply views Thread by kermitthefrogpy | last post: by
By using this site, you agree to our Privacy Policy and Terms of Use.