Help with select tag

[Jason]

Hey, would appreciate some help with these two issues with the code
below...

1) In IE, when using the dropdown and the mouse goes outside the box,
the selection is filled. This might be because the focus is briefly
changed briefly when the table responds to the onmouse out... is there
a way to prevent this?

2) I'd like to make the div on a seperate layer and bring it down so
it overlaps with the table/box border a little... have tried doing
this with css positioning but no luck... any suggestions?

thanks heap :) ... jason


<div><b>Title </b></div>
<table cellspacing="0" cellpadding="0" border="0">
<tr><td onmouseover="th is.style.backgr oundColor='#aaa aaa';"
style="backgrou nd-color:#dddddd"
onmouseout="thi s.style.backgro undColor='#dddd dd';">
<table cellspacing="1" cellpadding="6" border="0"
width="100%"><t r><td valign="top" bgcolor="#fffff f"
background="ima ges/heart.gif">

<table>
<tr>
<td align="right">S elect</td>
<td>&nbsp;</td>
<td><select width="20">
<option></option>
<option>1</option>
<option>2</option>
<option>3</option>
<option>4</option>
<option>5</option>
<option>6</option>
<option>7</option>
</select></td>
</tr><tr>
<td align="right">A ge</td>
<td>&nbsp;</td>
<td><input value=18 size=2> to <input value=99
size=2></td>
</tr>
</table>
</td></tr></table>
</td></tr></table>

[luke]

Re: Help with select tag

2) is easy enough to do but 1) is a little more tricky as when you go to the
select box the TD loses focus.

The is the closest fix I could think of and may not be exactly what you
require. See what you think

Luke
=========

<div id="page">
<div id="title" style="position :relative; top:8px; left:3px;
z-index:10"><b>Ti tle</b></div>
<div id="content" style="z-index:5">
<table cellspacing="0" cellpadding="0" border="0">
<tr><td id="cell_01" style="backgrou nd-color:#dddddd">
<table cellspacing="1" cellpadding="6" border="0"
width="100%"><t r><td valign="top" bgcolor="#fffff f"
background="ima ges/heart.gif">

<table>
<tr>
<td align="right">S elect</td>
<td>&nbsp;</td>
<td><select width="20"
onfocus="cell_0 1.style.backgro undColor='#aaaa aa';"
onblur="cell_01 .style.backgrou ndColor='#ddddd d';">
<option></option>
<option>1</option>
<option>2</option>
<option>3</option>
<option>4</option>
<option>5</option>
<option>6</option>
<option>7</option>
</select></td>
</tr><tr>
<td align="right">A ge</td>
<td>&nbsp;</td>
<td><input value=18 size=2
onfocus="cell_0 1.style.backgro undColor='#aaaa aa';"
onblur="cell_01 .style.backgrou ndColor='#ddddd d';"> to <input value=99
size=2 onfocus="cell_0 1.style.backgro undColor='#aaaa aa';"
onblur="cell_01 .style.backgrou ndColor='#ddddd d';"></td>
</tr>
</table>
</td></tr></table>
</td></tr></table>
</div>
</div>

[Jason]

Re: Help with select tag

thanks for your help Luke :)

Below is a solution I came up with. Not exactly elegant!

Jason



<table width="100%" cellspacing="0" cellpadding="0"
border="0"><tr> <td> <div id="t1"
onmouseover="th is.style.backgr oundColor='#999 999';"
onmouseout="jav ascript:{if (t1Status==0)
{this.style.bac kgroundColor='# dddddd';}}"
style="backgrou nd-color:#dddddd" valign="top"> <table
cellspacing="1" cellpadding="6" border="0" width="100%"><t r><td
valign="top" bgcolor="#fffff f">
<br/>

<table width=100%>
<tr>
<td align="right">S tate</td>
<td>&nbsp;</td>
<td>
<select
onfocus="javasc ript:{t1Status= 1;setTimeout('t 1Status=0;', 3000);}"
onblur="javascr ipt:{t1Status=0 ;
document.all.t1 .style.backgrou ndColor='#ddddd d';}">
<option></option>
<option>1</option>
<option>2</option>
<option>3</option>
<option>4</option>
<option>5</option>
<option>6</option>
<option>7</option>
</select>
</td>
</tr>
</table>
</td></tr></table></td></tr></table>