jw***********@yahoo.com wrote:
I would like for users to be able to select from a small number of options
that come from a little drop down menu which then closes.
.
http://www.geocities.com/jweinberg19...on_text00.html
.
In order to see the behavior you should "mouseover" the white-on-black text
segment that says "omnis dolor repellend"
.
the thing is that I don't want for the whole space in the paragraph to be
empty. I just need for the little menu to show and then go away without
disturbing the text and/or other HTML around it
.
After the user makes a selection it should just nicely close.
.
Also I can't figure out how to make the menu close if the user does not
make an selection for a period of time
<html>
<head>
<style type="text/css" media="all">
body, td {
font-family: Verdana;
font-size: 14px;
margin: 10px;
}
#omnis {
color: white;
background-color: black;
}
..vis {
visibility: visible;
display: block;
background-color: white;
z-index: 1;
position: absolute;
/* what are top and left screen positions */
/* where radios should be displayed on screen */
top: 65px;
left: 150px;
}
..invis {
visibility: hidden;
display: none;
}
</style>
<script language="javascript" type="text/javascript">
// how long radios remain visible after onMouseover ?
var seconds_onMouseover = 10
// how long radios remain visible after selection is made ?
var seconds_selection = 0.5
function show_Radios() {
mytable.className='vis'
setTimeout("mytable.className='invis'",
seconds_onMouseover * 1000)
}
function hide_Radios(choice) {
alert('you chose: ' + choice)
setTimeout("mytable.className='invis'",
seconds_selection * 1000)
}
</script>
</head>
<body bgcolor="silver">
<p>text text text text text text text text text text text text<br>
text text text text text text text text text text text text<br>
text text text <span id="omnis" onMouseOver="show_Radios();">
omnis dolor repellend</span> text text text text<br>
text text text text text text text text text text text text<br>
text text text text text text text text text text text text<br>
text text text text text text text text text text text text<br>
text text text text text text text text text text text text<br>
text text text text text text text text text text text text<br>
text text text text text text text text text text text text<br>
text text text text text text text text text text text text<br>
text text text text text text text text text text text text<br>
text text text text text text text text text text text text<br>
text text text text text text text text text text text text
</p>
<table id="mytable" class="invis">
<tr>
<td>
<form>
<input type="radio" name="op2" checked
onclick="javascript
:hide_Radios(0)">all news<br/>
<input type="radio" name="op2"
onclick="javascript
:hide_Radios(1)">selected<br/>
<input type="radio" name="op2"
onclick="javascript
:hide_Radios(2)">not selected
</form>
</td>
</tr>
</table>
</body>
</html>
--
Bart
