Solved

Select box

Posted on 2006-10-22
6
210 Views
Last Modified: 2010-04-09
Hi

Is it possible to display a hint in the contents of a select box ?
For example the details of the current option but before the user click it...

Thanks in advance.
0
Comment
Question by:CodedK
  • 4
  • 2
6 Comments
 
LVL 41

Accepted Solution

by:
HonorGod earned 200 total points
ID: 17783987
If you use the title attribute, this "may" do what you want.  For example:

<select>
  <option title='This is a test'>one</option>
  <option title='This is something else'>two</option>
  <option title='Are you kidding?'>three</option>
</select>

  If you click on the selection list, and hold the cursor over one of the entries (e.g., "one"), then the hint/tip message in the title attribute is displayed.  If this isn't what you want, please be more specific.
0
 
LVL 16

Author Comment

by:CodedK
ID: 17784299
Thank you HonorGod... There is a problem.. It works in FF but not in IE.
0
 
LVL 41

Expert Comment

by:HonorGod
ID: 17784574
Ah.  checking
0
Technology Partners: We Want Your Opinion!

We value your feedback.

Take our survey and automatically be enter to win anyone of the following:
Yeti Cooler, Amazon eGift Card, and Movie eGift Card!

 
LVL 41

Expert Comment

by:HonorGod
ID: 17784578
Hm.  Apparently, IE only wants to use titles in a limited number of instances.  How about this?
Changing the status message line (bottom of the browser) based upon the value of the current title?
---------------------------------------------------------------------------------------------------------------
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
<html>
<head>
<title> Select Tip </title>
<script type='text/javascript' src='../objDisplay.js'></script>
<script type='text/javascript'>
  function chgTitle( obj ) {
    var child = obj.selectedIndex;
    var opts  = obj.getElementsByTagName( 'option' );
    var kid   = opts[ child ];
    obj.title = kid.title;
    window.status = kid.title;
  }

  function init( id ) {
    var obj = document.getElementById( id );
    chgTitle( obj );
    obj.focus();
  }
</script>
</head>
<body onload='init("here")'>
<select id='here' onkeyup='chgTitle(this)'>
  <option title='This is a test'>one</option>
  <option title='This is something else'>two</option>
  <option title='Are you kidding?'>three</option>
</select>
<a href='#' title='Is this working?' onclick='return false;'>My link</a>
</html>
0
 
LVL 16

Author Comment

by:CodedK
ID: 17787061
Thank you HonorGod.
Unfortunately i allready use some JS for the onclick of the selected option.

Anyway, thank you for your time and your good answers :)
0
 
LVL 41

Expert Comment

by:HonorGod
ID: 17805759
Thanks for the 'A'
0

Featured Post

Free Tool: Subnet Calculator

The subnet calculator helps you design networks by taking an IP address and network mask and returning information such as network, broadcast address, and host range.

One of a set of tools we're offering as a way of saying thank you for being a part of the community.

Question has a verified solution.

If you are experiencing a similar issue, please ask a related question

Suggested Solutions

Title # Comments Views Activity
Search Item in Table 2 43
CSS in HTML 5 51
Sending ASP to server side 8 28
How to add custom html-5 element to a dynamically generated link? 4 23
Not sure what the best email signature size is? Are you worried about email signature image size? Follow this best practice guide.
When crafting your “Why Us” page, there are a plethora of pitfalls to avoid. Follow these five tips, and you’ll be well on your way to creating an effective page.
In this tutorial viewers will learn how add a scalable full-width header using CSS3. Create a new HTML document with an internal stylesheet. Set a tiled background.:  Create a new div and name it Header. Position it with position:absolute at the top…
In this tutorial viewers will learn how to style elements, such a divs, with a "drop shadow" effect using the CSS box-shadow property Start with a normal styled element, such as a div.: In the element's style, type the box shadow property: "box-shad…

679 members asked questions and received personalized solutions in the past 7 days.

Join the community of 500,000 technology professionals and ask your questions.

Join & Ask a Question