Velocity Reviews

Velocity Reviews (http://www.velocityreviews.com/forums/index.php)
-   Javascript (http://www.velocityreviews.com/forums/f68-javascript.html)
-   -   how to hide a select box in a table when i scroll top or left using stylee sheets (http://www.velocityreviews.com/forums/t924929-how-to-hide-a-select-box-in-a-table-when-i-scroll-top-or-left-using-stylee-sheets.html)

pavi 05-24-2006 12:14 PM

how to hide a select box in a table when i scroll top or left using stylee sheets
 
Hi,

I have created a table with scroll effects using style sheets, in one
of the TD I have created a select box now what I want is when I scroll
top or left I want the select box to be hidden and when I scroll back
it should be displayed. I am attaching the code, if u go through the
code u will get a better idea of what I want.

thanks


<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.0 Transitional//EN">
<HTML><HEAD>
<STYLE type=text/css>
..l {
TEXT-ALIGN: left
}

..r {
TEXT-ALIGN: right
}


..table {
BORDER-TOP-WIDTH: 1px; FONT-WEIGHT: normal; BORDER-LEFT-WIDTH: 1px;
FONT-SIZE: small; BORDER-LEFT-COLOR: #000000; BORDER-BOTTOM-WIDTH: 1px;
BORDER-BOTTOM-COLOR: #000000; WIDTH: 99%; COLOR: #002288;
BORDER-TOP-COLOR: #000000; FONT-STYLE: normal; FONT-FAMILY: Arial,
Helvetica, sans-serif; BACKGROUND-COLOR: #f0f0f0; BORDER-RIGHT-WIDTH:
1px; BORDER-RIGHT-COLOR: #000000
}

..Data {
FONT-WEIGHT: normal; FONT-SIZE: small; COLOR: #000000; FONT-STYLE:
normal; FONT-FAMILY: Arial, Helvetica, sans-serif; BACKGROUND-COLOR:
#d3d3d3;
}

..rowheader {
LEFT: expression(document.getElementById("data").scrollL eft);
POSITION: relative; BACKGROUND-COLOR: #b0b0b0
}

}
..header {
FONT-WEIGHT: bold; FONT-SIZE: medium; Z-INDEX: 20; COLOR: #0033aa;
FONT-STYLE: normal; FONT-FAMILY: Arial, Helvetica, sans-serif;
POSITION: relative; ; TOP:
expression(document.getElementById("data").scrollT op-2);
BACKGROUND-COLOR: #b0b0b0;
}

</STYLE>


</HEAD>
<BODY >

<DIV >

<DIV>
<DIV align=center>
<DIV id=data style="OVERFLOW: auto; WIDTH: 30%; HEIGHT: 348px">
<TABLE class=table borderColor=#000000 cellSpacing=1 cellPadding=7
rules=groups
border=1 >

<THEAD>
<TR>
<TH class="l rowheader header" style="Z-INDEX: 30"
scope=col>Name</TH>
<TH class="l rowheader header" style="Z-INDEX: 30"
scope=col>Sex</TH>
<TH class=" header" scope=col>Age</TH>
<TH class=" header" scope=col>Height</TH>
<TH class=" header" scope=col>Weight</TH></TR></THEAD>
<TBODY>
<TR>
<TH class="l rowheader" scope=col>Alfred</TH>
<TD class="l rowheader">M</TD>
<TD class="r Data" ><select id=id1
><option>10<option>9<option>8<option>7<option>6<op tion>5</select></TD>

<TD class="r Data">69.0</TD>
<TD class="r Data">112.5</TD></TR>
<TR>
<TH class="l rowheader" scope=col>Alice</TH>
<TD class="l rowheader">F</TD>
<TD class="r Data">13</TD>
<TD class="r Data">56.5</TD>
<TD class="r Data">84.0</TD></TR>
<TR>
<TH class="l rowheader" scope=col>Barbara</TH>
<TD class="l rowheader">F</TD>
<TD class="r Data">13</TD>
<TD class="r Data">65.3</TD>
<TD class="r Data">98.0</TD></TR>
<TR>
<TH class="l rowheader" scope=col>Carol</TH>
<TD class="l rowheader">F</TD>
<TD class="r Data">14</TD>
<TD class="r Data">62.8</TD>
<TD class="r Data">102.5</TD></TR>
<TR>
<TH class="l rowheader" scope=col>Henry</TH>
<TD class="l rowheader">M</TD>
<TD class="r Data">14</TD>
<TD class="r Data">63.5</TD>
<TD class="r Data">102.5</TD></TR>
<TR>
<TH class="l rowheader" scope=col>James</TH>
<TD class="l rowheader">M</TD>
<TD class="r Data">12</TD>
<TD class="r Data">57.3</TD>
<TD class="r Data">83.0</TD></TR>
<TR>
<TH class="l rowheader" scope=col>Jane</TH>
<TD class="l rowheader">F</TD>
<TD class="r Data">12</TD>
<TD class="r Data">59.8</TD>
<TD class="r Data">84.5</TD></TR>
<TR>
<TH class="l rowheader" scope=col>Janet</TH>
<TD class="l rowheader">F</TD>
<TD class="r Data">15</TD>
<TD class="r Data">62.5</TD>
<TD class="r Data">112.5</TD></TR>
<TR>
<TH class="l rowheader" scope=col>Jeffrey</TH>
<TD class="l rowheader">M</TD>
<TD class="r Data">13</TD>
<TD class="r Data">62.5</TD>
<TD class="r Data">84.0</TD></TR>
<TR>
<TH class="l rowheader" scope=col>John</TH>
<TD class="l rowheader">M</TD>
<TD class="r Data">12</TD>
<TD class="r Data">59.0</TD>
<TD class="r Data">99.5</TD></TR>
<TR>
<TH class="l rowheader" scope=col>Joyce</TH>
<TD class="l rowheader">F</TD>
<TD class="r Data">11</TD>
<TD class="r Data">51.3</TD>
<TD class="r Data">50.5</TD></TR>
<TR>
<TH class="l rowheader" scope=col>Judy</TH>
<TD class="l rowheader">F</TD>
<TD class="r Data">14</TD>
<TD class="r Data">64.3</TD>
<TD class="r Data">90.0</TD></TR>
<TR>
<TH class="l rowheader" scope=col>Louise</TH>
<TD class="l rowheader">F</TD>
<TD class="r Data">12</TD>
<TD class="r Data">56.3</TD>
<TD class="r Data">77.0</TD></TR>
<TR>
<TH class="l rowheader" scope=col>Mary</TH>
<TD class="l rowheader">F</TD>
<TD class="r Data">15</TD>
<TD class="r Data">66.5</TD>
<TD class="r Data">112.0</TD></TR>
<TR>
<TH class="l rowheader" scope=col>Philip</TH>
<TD class="l rowheader">M</TD>
<TD class="r Data">16</TD>
<TD class="r Data">72.0</TD>
<TD class="r Data">150.0</TD></TR>
<TR>
<TH class="l rowheader" scope=col>Robert</TH>
<TD class="l rowheader">M</TD>
<TD class="r Data">12</TD>
<TD class="r Data">64.8</TD>
<TD class="r Data">128.0</TD></TR>
<TR>
<TH class="l rowheader" scope=col>Ronald</TH>
<TD class="l rowheader">M</TD>
<TD class="r Data">15</TD>
<TD class="r Data">67.0</TD>
<TD class="r Data">133.0</TD></TR>
<TR>
<TH class="l rowheader" scope=col>Thomas</TH>
<TD class="l rowheader">M</TD>
<TD class="r Data">11</TD>
<TD class="r Data">57.5</TD>
<TD class="r Data">85.0</TD></TR>
<TR>
<TH class="l rowheader" scope=col>William</TH>
<TD class="l rowheader">M</TD>
<TD class="r Data">15</TD>
<TD class="r Data">66.5</TD>
<TD class="r Data">112.0</TD>
</TR></TBODY></TABLE></DIV></DIV></DIV><BR></DIV></BODY></HTML>



All times are GMT. The time now is 10:55 AM.

Powered by vBulletin®. Copyright ©2000 - 2014, vBulletin Solutions, Inc.
SEO by vBSEO ©2010, Crawlability, Inc.