1. Home
  2. Forums Index
  3. Browser Side / JavaScript and AJAX 7:44 am May 14, 2026

Forum Moderators: open

Message Too Old, No Replies

Link To Section That Opens

How can I do this?

         

jereece

6:18 pm on Mar 31, 2005 (gmt 0)

10+ Year Member



If you take the code below and make it an .htm file, you will see that I have created a document index with sections that expand. What I can't seem to figure out is, on another web page how to link directly to a section so that it expands. For example, on another web page, I may want to link to the "Chapter 6 - Site 3 Specific" section so that it is open just like I had opened the index and clicked on that section's link. Any help is appreciated.

Jim

<-----HTML------>
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.0 Transitional//EN">
<HTML><HEAD><TITLE>Document Index</TITLE>
<META http-equiv=Content-Type content="text/html; charset=windows-1252">
<!-- Java Script created by Jim Reece on Friday, July 18, 2003. -->
<SCRIPT type=text/javascript>
function openTable(tableid) {
which = document.getElementById(tableid);
if (which.style.display == "block") {
which.style.display = "none";
}
else {
which.style.display = "block";
}
}
</SCRIPT>

<base target="_blank">
</HEAD>
<BODY vLink=#4f4fff aLink=#4f4fff link=#4f4fff><BASEFONT face=Arial>

<p align="center"><u><b><font size="5">Document Index</font></b></u></p>
<p style="margin-top: 0; margin-bottom: 0">

<img border="0" src="../images/bullet2.gif" width="12" height="12">
<a onclick="openTable('table01'); return false;" href="">
Chapter 1 - Administrative</a> </p>
<p style="margin-top: 0; margin-bottom: 0"> </p>
<DIV align=center>
<CENTER>
<TABLE id=table01 style="DISPLAY: none; BORDER-COLLAPSE: collapse"
borderColor=#000000 cellSpacing=0 cellPadding=0 width="95%" border=1>
<TBODY>
<TR>
<TD align=center height="15" width="97">
<p style="margin-top: 0; margin-bottom: 0"><B><FONT size=2>Doc. Index No.</FONT></B></TD>
<TD align=middle height="15" width="532">
<p style="margin-top: 0; margin-bottom: 0"><B><FONT size=2>Document Title</FONT></B></TD>
<TD height="15" width="20" valign="top">
<p align="center" style="margin-top: 0; margin-bottom: 0"><font size="2"><b>
Revision
Date</b></font></TD>
</TR>
<TR>
<TD
style="PADDING-RIGHT: 4px; PADDING-LEFT: 4px; FONT-WEIGHT: 400; FONT-SIZE: 10pt; PADDING-BOTTOM: 1px; VERTICAL-ALIGN: bottom; COLOR: windowtext; PADDING-TOP: 1px; FONT-STYLE: normal; FONT-FAMILY: Arial; WHITE-SPACE: nowrap; TEXT-DECORATION: none"
align=center width=89 background=../default_files/none height=18>
<p style="margin-top: 0; margin-bottom: 0">&nbsp;</TD>
<TD
style="PADDING-RIGHT: 4px; PADDING-LEFT: 4px; FONT-WEIGHT: 400; FONT-SIZE: 10pt; PADDING-BOTTOM: 1px; VERTICAL-ALIGN: bottom; COLOR: windowtext; PADDING-TOP: 1px; FONT-STYLE: normal; FONT-FAMILY: Arial; WHITE-SPACE: nowrap; TEXT-DECORATION: none"
width=524 background=../default_files/none height=18>
<p style="margin-top: 0; margin-bottom: 0">No Documents</TD>
</TR></TBODY></TABLE></CENTER></DIV>

<p style="margin-top: 0; margin-bottom: 0">

<img border="0" src="../images/bullet2.gif" width="12" height="12">
<a onclick="openTable('table02'); return false;" href="">
Chapter 2 - Environmental</a> </p>
<p style="margin-top: 0; margin-bottom: 0"> </p>
<DIV align=center>
<CENTER>
<TABLE id=table02 style="DISPLAY: none; BORDER-COLLAPSE: collapse"
borderColor=#000000 cellSpacing=0 cellPadding=0 width="95%" border=1>
<TBODY>
<TR>
<TD align=center height="15" width="97">
<p style="margin-top: 0; margin-bottom: 0"><B><FONT size=2>Doc. Index No.</FONT></B></TD>
<TD align=middle height="15" width="532">
<p style="margin-top: 0; margin-bottom: 0"><B><FONT size=2>Document Title</FONT></B></TD>
<TD align=center height="15" width="20" valign="top">
<p style="margin-top: 0; margin-bottom: 0"><font size="2"><b>
Revision<br>
Date</b></font></TD>
</TR>
<TR>
<TD
style="PADDING-RIGHT: 4px; PADDING-LEFT: 4px; FONT-WEIGHT: 400; FONT-SIZE: 10pt; PADDING-BOTTOM: 1px; VERTICAL-ALIGN: bottom; COLOR: windowtext; PADDING-TOP: 1px; FONT-STYLE: normal; FONT-FAMILY: Arial; WHITE-SPACE: nowrap; TEXT-DECORATION: none"
align=center width=89 background=../default_files/none height=18>
<p style="margin-top: 0; margin-bottom: 0">&nbsp;</TD>
<TD
style="PADDING-RIGHT: 4px; PADDING-LEFT: 4px; FONT-WEIGHT: 400; FONT-SIZE: 10pt; PADDING-BOTTOM: 1px; VERTICAL-ALIGN: bottom; COLOR: windowtext; PADDING-TOP: 1px; FONT-STYLE: normal; FONT-FAMILY: Arial; WHITE-SPACE: nowrap; TEXT-DECORATION: none"
width=524 background=../default_files/none height=18>
<p style="margin-top: 0; margin-bottom: 0">No Documents</TD>
</TR></TBODY></TABLE></CENTER></DIV>

<p style="margin-top: 0; margin-bottom: 0">

<img border="0" src="../images/bullet2.gif" width="12" height="12">
<a onclick="openTable('table03'); return false;" href="">
Chapter 3 - Health &amp; Safety</a> </p>
<p style="margin-top: 0; margin-bottom: 0"> </p>
<DIV align=center>
<CENTER>
<TABLE id=table03 style="DISPLAY: none; BORDER-COLLAPSE: collapse"
borderColor=#000000 cellSpacing=0 cellPadding=0 width="95%" border=1>
<TBODY>
<TR>
<TD align=center height="15" width="97">
<p style="margin-top: 0; margin-bottom: 0"><B><FONT size=2>Doc. Index No.</FONT></B></TD>
<TD align=middle height="15" width="532">
<p style="margin-top: 0; margin-bottom: 0"><B><FONT size=2>Document Title</FONT></B></TD>
<TD align=center height="15" width="20" valign="top">
<p style="margin-top: 0; margin-bottom: 0"><font size="2"><b>
Revision<br>
Date</b></font></TD>
</TR>
<tr>
<TD
style="PADDING-RIGHT: 4px; PADDING-LEFT: 4px; FONT-WEIGHT: 400; FONT-SIZE: 10pt; PADDING-BOTTOM: 1px; VERTICAL-ALIGN: bottom; COLOR: windowtext; PADDING-TOP: 1px; FONT-STYLE: normal; FONT-FAMILY: Arial; WHITE-SPACE: nowrap; TEXT-DECORATION: none"
align=center width=89 background=../default_files/none height=18>
<p style="margin-top: 0; margin-bottom: 0">
<a href="nswp/04-02.pdf">Link 1</a></TD>
<TD
style="PADDING-RIGHT: 4px; PADDING-LEFT: 4px; FONT-WEIGHT: 400; FONT-SIZE: 10pt; PADDING-BOTTOM: 1px; VERTICAL-ALIGN: bottom; COLOR: windowtext; PADDING-TOP: 1px; FONT-STYLE: normal; FONT-FAMILY: Arial; WHITE-SPACE: nowrap; TEXT-DECORATION: none"
width=524 background=../default_files/none height=18>
<p style="margin-top: 0; margin-bottom: 0">Document 1</TD>
<TD
style="PADDING-RIGHT: 4px; PADDING-LEFT: 4px; FONT-WEIGHT: 400; FONT-SIZE: 10pt; PADDING-BOTTOM: 1px; VERTICAL-ALIGN: top; COLOR: windowtext; PADDING-TOP: 1px; FONT-STYLE: normal; FONT-FAMILY: Arial; WHITE-SPACE: nowrap; TEXT-DECORATION: none"
width=20 height=18>
<p style="margin-top: 0; margin-bottom: 0"></TD>
</tr>
<tr>
<TD
style="PADDING-RIGHT: 4px; PADDING-LEFT: 4px; FONT-WEIGHT: 400; FONT-SIZE: 10pt; PADDING-BOTTOM: 1px; VERTICAL-ALIGN: bottom; COLOR: windowtext; PADDING-TOP: 1px; FONT-STYLE: normal; FONT-FAMILY: Arial; WHITE-SPACE: nowrap; TEXT-DECORATION: none"
align=center width=89 background=../default_files/none height=18>
<p style="margin-top: 0; margin-bottom: 0">
<a href="nswp/07-03.pdf">Link 2</a></TD>
<TD
style="PADDING-RIGHT: 4px; PADDING-LEFT: 4px; FONT-WEIGHT: 400; FONT-SIZE: 10pt; PADDING-BOTTOM: 1px; VERTICAL-ALIGN: bottom; COLOR: windowtext; PADDING-TOP: 1px; FONT-STYLE: normal; FONT-FAMILY: Arial; WHITE-SPACE: nowrap; TEXT-DECORATION: none"
width=524 background=../default_files/none height=18>
<p style="margin-top: 0; margin-bottom: 0">Document 2</TD>
<TD
style="PADDING-RIGHT: 4px; PADDING-LEFT: 4px; FONT-WEIGHT: 400; FONT-SIZE: 10pt; PADDING-BOTTOM: 1px; VERTICAL-ALIGN: top; COLOR: windowtext; PADDING-TOP: 1px; FONT-STYLE: normal; FONT-FAMILY: Arial; WHITE-SPACE: nowrap; TEXT-DECORATION: none"
width=20 height=18 align="center">
<p style="margin-top: 0; margin-bottom: 0"></TD>
</tr>
<TR>
<TD height="19" width="97" align="center">
<p style="margin-top: 0; margin-bottom: 0">&nbsp;</TD>
<TD height="19" width="532">
<p style="margin-top: 0; margin-bottom: 0">&nbsp;</TD>
<TD height="19" width="20" align="center" valign="top">
<p style="margin-top: 0; margin-bottom: 0">&nbsp;</TD>
</TR></TBODY></TABLE></CENTER></DIV>

<p style="margin-top: 0; margin-bottom: 0">
<img border="0" src="../images/bullet2.gif" width="12" height="12">
<a onclick="openTable('table04'); return false;" href="">
Chapter 4 - Site 1 Specific</a> </p>
<p style="margin-top: 0; margin-bottom: 0"> </p>
<DIV align=center>
<CENTER>
<TABLE id=table04 style="DISPLAY: none; BORDER-COLLAPSE: collapse"
borderColor=#000000 cellSpacing=0 cellPadding=0 width="95%" border=1>
<TBODY>
<TR>
<TD align=center height="15" width="97">
<p style="margin-top: 0; margin-bottom: 0"><B><FONT size=2>Doc. Index No.</FONT></B></TD>
<TD align=middle height="15" width="532">
<p style="margin-top: 0; margin-bottom: 0"><B><FONT size=2>Document Title</FONT></B></TD>
</TR>
<TR>
<TD
style="PADDING-RIGHT: 4px; PADDING-LEFT: 4px; FONT-WEIGHT: 400; FONT-SIZE: 10pt; PADDING-BOTTOM: 1px; VERTICAL-ALIGN: bottom; COLOR: windowtext; PADDING-TOP: 1px; FONT-STYLE: normal; FONT-FAMILY: Arial; WHITE-SPACE: nowrap; TEXT-DECORATION: none"
align=center width=89 background=../default_files/none height=18>
&nbsp;</TD>
<TD
style="PADDING-RIGHT: 4px; PADDING-LEFT: 4px; FONT-WEIGHT: 400; FONT-SIZE: 10pt; PADDING-BOTTOM: 1px; VERTICAL-ALIGN: bottom; COLOR: windowtext; PADDING-TOP: 1px; FONT-STYLE: normal; FONT-FAMILY: Arial; WHITE-SPACE: nowrap; TEXT-DECORATION: none"
width=524 background=../default_files/none height=18>
<p style="margin-top: 0; margin-bottom: 0">&nbsp;</TD>
</TR>
<TR>
<TD
style="PADDING-RIGHT: 4px; PADDING-LEFT: 4px; FONT-WEIGHT: 400; FONT-SIZE: 10pt; PADDING-BOTTOM: 1px; VERTICAL-ALIGN: bottom; COLOR: windowtext; PADDING-TOP: 1px; FONT-STYLE: normal; FONT-FAMILY: Arial; WHITE-SPACE: nowrap; TEXT-DECORATION: none"
align=center width=89 background=../default_files/none height=18>
&nbsp;</TD>
<TD
style="PADDING-RIGHT: 4px; PADDING-LEFT: 4px; FONT-WEIGHT: 400; FONT-SIZE: 10pt; PADDING-BOTTOM: 1px; VERTICAL-ALIGN: bottom; COLOR: windowtext; PADDING-TOP: 1px; FONT-STYLE: normal; FONT-FAMILY: Arial; WHITE-SPACE: nowrap; TEXT-DECORATION: none"
width=524 background=../default_files/none height=18>
<p style="margin-top: 0; margin-bottom: 0">&nbsp;</TD>
</TR>
<TR>
<TD
style="PADDING-RIGHT: 4px; PADDING-LEFT: 4px; FONT-WEIGHT: 400; FONT-SIZE: 10pt; PADDING-BOTTOM: 1px; VERTICAL-ALIGN: bottom; COLOR: windowtext; PADDING-TOP: 1px; FONT-STYLE: normal; FONT-FAMILY: Arial; WHITE-SPACE: nowrap; TEXT-DECORATION: none"
align=center width=89 background=../default_files/none height=18>
&nbsp;</TD>
<TD
style="PADDING-RIGHT: 4px; PADDING-LEFT: 4px; FONT-WEIGHT: 400; FONT-SIZE: 10pt; PADDING-BOTTOM: 1px; VERTICAL-ALIGN: bottom; COLOR: windowtext; PADDING-TOP: 1px; FONT-STYLE: normal; FONT-FAMILY: Arial; WHITE-SPACE: nowrap; TEXT-DECORATION: none"
width=524 background=../default_files/none height=18>
<p style="margin-top: 0; margin-bottom: 0">&nbsp;</TD>
</TR>
</TBODY></TABLE></CENTER></DIV>

<p style="margin-top: 0; margin-bottom: 0">
<img border="0" src="../images/bullet2.gif" width="12" height="12">
<a onclick="openTable('table05'); return false;" href="">
Chapter 5 - Site 2 Specific</a> </p>
<p style="margin-top: 0; margin-bottom: 0"> </p>
<DIV align=center>
<CENTER>
<TABLE id=table05 style="DISPLAY: none; BORDER-COLLAPSE: collapse"
borderColor=#000000 cellSpacing=0 cellPadding=0 width="95%" border=1>
<TBODY>
<TR>
<TD align=center height="15" width="97">
<p style="margin-top: 0; margin-bottom: 0"><B><FONT size=2>Doc. Index No.</FONT></B></TD>
<TD align=middle height="15" width="532">
<p style="margin-top: 0; margin-bottom: 0"><B><FONT size=2>Document Title</FONT></B></TD>
</TR>
<TR>
<TD
style="PADDING-RIGHT: 4px; PADDING-LEFT: 4px; FONT-WEIGHT: 400; FONT-SIZE: 10pt; PADDING-BOTTOM: 1px; VERTICAL-ALIGN: bottom; COLOR: windowtext; PADDING-TOP: 1px; FONT-STYLE: normal; FONT-FAMILY: Arial; WHITE-SPACE: nowrap; TEXT-DECORATION: none"
align=center width=89 background=../default_files/none height=18>
&nbsp;</TD>
<TD
style="PADDING-RIGHT: 4px; PADDING-LEFT: 4px; FONT-WEIGHT: 400; FONT-SIZE: 10pt; PADDING-BOTTOM: 1px; VERTICAL-ALIGN: bottom; COLOR: windowtext; PADDING-TOP: 1px; FONT-STYLE: normal; FONT-FAMILY: Arial; WHITE-SPACE: nowrap; TEXT-DECORATION: none"
width=524 background=../default_files/none height=18>
<p style="margin-top: 0; margin-bottom: 0">&nbsp;</TD>
</TR>
<TR>
<TD
style="PADDING-RIGHT: 4px; PADDING-LEFT: 4px; FONT-WEIGHT: 400; FONT-SIZE: 10pt; PADDING-BOTTOM: 1px; VERTICAL-ALIGN: bottom; COLOR: windowtext; PADDING-TOP: 1px; FONT-STYLE: normal; FONT-FAMILY: Arial; WHITE-SPACE: nowrap; TEXT-DECORATION: none"
align=center width=89 background=../default_files/none height=18>
&nbsp;</TD>
<TD
style="PADDING-RIGHT: 4px; PADDING-LEFT: 4px; FONT-WEIGHT: 400; FONT-SIZE: 10pt; PADDING-BOTTOM: 1px; VERTICAL-ALIGN: bottom; COLOR: windowtext; PADDING-TOP: 1px; FONT-STYLE: normal; FONT-FAMILY: Arial; WHITE-SPACE: nowrap; TEXT-DECORATION: none"
width=524 background=../default_files/none height=18>
&nbsp;</TD>
</TR>
<TR>
<TD
style="PADDING-RIGHT: 4px; PADDING-LEFT: 4px; FONT-WEIGHT: 400; FONT-SIZE: 10pt; PADDING-BOTTOM: 1px; VERTICAL-ALIGN: bottom; COLOR: windowtext; PADDING-TOP: 1px; FONT-STYLE: normal; FONT-FAMILY: Arial; WHITE-SPACE: nowrap; TEXT-DECORATION: none"
align=center width=89 background=../default_files/none height=18>
&nbsp;</TD>
<TD
style="PADDING-RIGHT: 4px; PADDING-LEFT: 4px; FONT-WEIGHT: 400; FONT-SIZE: 10pt; PADDING-BOTTOM: 1px; VERTICAL-ALIGN: bottom; COLOR: windowtext; PADDING-TOP: 1px; FONT-STYLE: normal; FONT-FAMILY: Arial; WHITE-SPACE: nowrap; TEXT-DECORATION: none"
width=524 background=../default_files/none height=18>
&nbsp;</TD>
</TR>
<TR>
<TD
style="PADDING-RIGHT: 4px; PADDING-LEFT: 4px; FONT-WEIGHT: 400; FONT-SIZE: 10pt; PADDING-BOTTOM: 1px; VERTICAL-ALIGN: bottom; COLOR: windowtext; PADDING-TOP: 1px; FONT-STYLE: normal; FONT-FAMILY: Arial; WHITE-SPACE: nowrap; TEXT-DECORATION: none"
align=center width=89 background=../default_files/none height=30>
&nbsp;</TD>
<TD
style="PADDING-RIGHT: 4px; PADDING-LEFT: 4px; FONT-WEIGHT: 400; FONT-SIZE: 10pt; PADDING-BOTTOM: 1px; VERTICAL-ALIGN: bottom; COLOR: windowtext; PADDING-TOP: 1px; FONT-STYLE: normal; FONT-FAMILY: Arial; WHITE-SPACE: nowrap; TEXT-DECORATION: none"
width=524 background=../default_files/none height=30>
&nbsp;</TD>
</TR>
</TBODY></TABLE></CENTER></DIV>

<p style="margin-top: 0; margin-bottom: 0">
<img border="0" src="../images/bullet2.gif" width="12" height="12">
<a onclick="openTable('table06'); return false;" href="">
Chapter 6 - Site 3 Specific</a> </p>
<p style="margin-top: 0; margin-bottom: 0"> </p>
<DIV align=center>
<CENTER>
<TABLE id=table06 style="DISPLAY: none; BORDER-COLLAPSE: collapse"
borderColor=#000000 cellSpacing=0 cellPadding=0 width="95%" border=1>
<TBODY>
<TR>
<TD align=center height="15" width="97" valign="top">
<p style="margin-top: 0; margin-bottom: 0"><B><FONT size=2>Doc. Index No.</FONT></B></TD>
<TD align=middle height="15" width="532">
<p style="margin-top: 0; margin-bottom: 0"><B><FONT size=2>
Document Title</FONT></B></TD>
</TR>
<TR>
<TD
style="PADDING-RIGHT: 4px; PADDING-LEFT: 4px; FONT-WEIGHT: 400; FONT-SIZE: 10pt; PADDING-BOTTOM: 1px; VERTICAL-ALIGN: top; COLOR: windowtext; PADDING-TOP: 1px; FONT-STYLE: normal; FONT-FAMILY: Arial; WHITE-SPACE: nowrap; TEXT-DECORATION: none"
align=center width=89 height=18>
CSWPs</TD>
<TD
style="PADDING-RIGHT: 4px; PADDING-LEFT: 4px; FONT-WEIGHT: 400; FONT-SIZE: 10pt; PADDING-BOTTOM: 1px; VERTICAL-ALIGN: bottom; COLOR: windowtext; PADDING-TOP: 1px; FONT-STYLE: normal; FONT-FAMILY: Arial; WHITE-SPACE: nowrap; TEXT-DECORATION: none"
width=524 background=../default_files/none height=18>
<ul>
<li><a href="http://www.test.com/document1.doc">Document 1</a></li>
<li><a href="http://www.test.com/document1.doc">Document 2</a></li>
<li><a href="http://www.test.com/document1.doc">Document 3</a></li>
</ul>
</TD>
</TR>
<TR>
<TD
style="PADDING-RIGHT: 4px; PADDING-LEFT: 4px; FONT-WEIGHT: 400; FONT-SIZE: 10pt; PADDING-BOTTOM: 1px; VERTICAL-ALIGN: top; COLOR: windowtext; PADDING-TOP: 1px; FONT-STYLE: normal; FONT-FAMILY: Arial; WHITE-SPACE: nowrap; TEXT-DECORATION: none"
align=center width=89 height=18>
SAGs</TD>
<TD
style="PADDING-RIGHT: 4px; PADDING-LEFT: 4px; FONT-WEIGHT: 400; FONT-SIZE: 10pt; PADDING-BOTTOM: 1px; VERTICAL-ALIGN: bottom; COLOR: windowtext; PADDING-TOP: 1px; FONT-STYLE: normal; FONT-FAMILY: Arial; WHITE-SPACE: nowrap; TEXT-DECORATION: none"
width=524 background=../default_files/none height=18>
&nbsp;</TD>
</TR>
<TR>
<TD
style="PADDING-RIGHT: 4px; PADDING-LEFT: 4px; FONT-WEIGHT: 400; FONT-SIZE: 10pt; PADDING-BOTTOM: 1px; VERTICAL-ALIGN: top; COLOR: windowtext; PADDING-TOP: 1px; FONT-STYLE: normal; FONT-FAMILY: Arial; WHITE-SPACE: nowrap; TEXT-DECORATION: none"
align=center width=89 height=18>
EWPs</TD>
<TD
style="PADDING-RIGHT: 4px; PADDING-LEFT: 4px; FONT-WEIGHT: 400; FONT-SIZE: 10pt; PADDING-BOTTOM: 1px; VERTICAL-ALIGN: bottom; COLOR: windowtext; PADDING-TOP: 1px; FONT-STYLE: normal; FONT-FAMILY: Arial; WHITE-SPACE: nowrap; TEXT-DECORATION: none"
width=524 background=../default_files/none height=18>
&nbsp;</TD>
</TR>
<TR>
<TD
style="PADDING-RIGHT: 4px; PADDING-LEFT: 4px; FONT-WEIGHT: 400; FONT-SIZE: 10pt; PADDING-BOTTOM: 1px; VERTICAL-ALIGN: top; COLOR: windowtext; PADDING-TOP: 1px; FONT-STYLE: normal; FONT-FAMILY: Arial; WHITE-SPACE: nowrap; TEXT-DECORATION: none"
align=center width=89 height=30>
&nbsp;</TD>
<TD
style="PADDING-RIGHT: 4px; PADDING-LEFT: 4px; FONT-WEIGHT: 400; FONT-SIZE: 10pt; PADDING-BOTTOM: 1px; VERTICAL-ALIGN: bottom; COLOR: windowtext; PADDING-TOP: 1px; FONT-STYLE: normal; FONT-FAMILY: Arial; WHITE-SPACE: nowrap; TEXT-DECORATION: none"
width=524 background=../default_files/none height=30>
&nbsp;</TD>
</TR>
</TBODY></TABLE></CENTER></DIV>

<p style="margin-top: 0; margin-bottom: 0">

&nbsp;</p>

</BODY></HTML>

CaseyRyan

7:57 pm on Mar 31, 2005 (gmt 0)

10+ Year Member



Howdy,
I've added code to yours which parses the hash out of the url. This would be useful in case this page gets long, you could also put in targets (<a name="...">) so that it not only opens that page, but scrolls to that section. 


... 
<SCRIPT type=text/javascript>  
function openTable(tableid) {  
which = document.getElementById(tableid);  
if (which){ 
if (which.style.display == "block") {  
which.style.display = "none";  
}  
else {  
which.style.display = "block";  
}  
} 
} 
function initialize(){ 
var tableid=document.location.hash; 
tableid = tableid.replace("#",""); 
if (tableid!= ""){ 
openTable(tableid); 
} 
} 
</SCRIPT>  
<base target="_blank">  
</HEAD>  
<BODY vLink=#4f4fff aLink=#4f4fff link=#4f4fff onload="initialize();"> 
...

-=casey=-

jereece

8:10 pm on Apr 3, 2005 (gmt 0)

10+ Year Member



I set up a bookmark (i.e. <a name="CSWPs">CSWPs</a>) in the index, then in a separate file I linked to the bookmark (i.e. <a href="index_new.htm#CSWPs">link to index bookmark</a>.), but it does not open the table and go to the bookmark. It does go to the index file, just not the bookmark or even open the table.

Any other suggestions? I really appreciate it.

Jim

jereece

7:31 pm on Apr 5, 2005 (gmt 0)

10+ Year Member



Does no one have any idea how to do this? Any help is appreciated.

Jim

Bernard Marx

11:50 pm on Apr 5, 2005 (gmt 0)

WebmasterWorld Senior Member 10+ Year Member



---- First page links ----

<a href="test.htm#table01" ...>

---- Target page script ---- 

function openTable(tableid)
{
  var table = document.getElementById(tableid);
  if(table)
    table.style.display = table.style.display == 'block'? 'none':'block';
}
window.onload = function()
{
  // the openTable function handles missing or irrelevant hash strings
  openTable(window.location.hash.substring(1));
}

note:
- Modern browsers (as per standards) can use ids as url hash target identifiers.
- As there's not much content, you won't notice the page scrolling unless you make the window very shallow.

totally unrelated note:

That HTML code looks WYSIWYG generated. It's worth making use of a style sheet to cut down on the massive code bloat.

eg..

<TD style="PADDING-RIGHT: 4px; PADDING-LEFT: 4px; FONT-WEIGHT: 400; FONT-SIZE: 10pt; PADDING-BOTTOM: 1px; VERTICAL-ALIGN: bottom; COLOR: windowtext; PADDING-TOP: 1px; FONT-STYLE: normal; FONT-FAMILY: Arial; WHITE-SPACE: nowrap; TEXT-DECORATION: none"
align=center width=89 background=../default_files/none height=18>

There are a few of these. The contents of the style attribute, could be put into a CSS class rule, AND the align, width & BG definitions added to that. All the tags could then be..

<td class="mycell">

jereece

12:15 am on Apr 7, 2005 (gmt 0)

10+ Year Member



I really appreciate the help Bernard Marx, but it still does not seem to work. When I click on the link New <a href="index2.htm#table01">link to a table</a>, it opens the page and shows the index, but does not open table01. Below is my revised code. I trimed it down to only 2 tables to minimize. Please see if you can look at this again.

I appologoze for the bloat code too. I inherited this and just have not taken the time to clean up. Is there a tool out there that will rip out old FrontPage code?

Thanks,
Jim

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.0 Transitional//EN">
<HTML><HEAD><TITLE>Document Index</TITLE>
<META http-equiv=Content-Type content="text/html; charset=windows-1252">
<!-- Java Script created by Jim Reece on Friday, July 18, 2003. -->
<SCRIPT type=text/javascript>
function openTable(tableid)
{
var table = document.getElementById(tableid);
if(table)
table.style.display = table.style.display == 'block'? 'none':'block';
}
window.onload = function()
{
// the openTable function handles missing or irrelevant hash strings
openTable(window.location.hash.substring(1));
}
</SCRIPT>
<base target="_blank">
</HEAD>
<BODY vLink=#4f4fff aLink=#4f4fff link=#4f4fff onload="initialize();"><BASEFONT face=Arial>

<p align="center"><u><b><font size="5">Document Index</font></b></u></p>
<p style="margin-top: 0; margin-bottom: 0">

<img border="0" src="../images/bullet2.gif" width="12" height="12">
<a onclick="openTable('table01'); return false;" href="">
Chapter 1 - Administrative</a> </p>
<p style="margin-top: 0; margin-bottom: 0"> </p>
<DIV align=center>
<CENTER>
<TABLE id=table01 style="DISPLAY: none; BORDER-COLLAPSE: collapse"
borderColor=#000000 cellSpacing=0 cellPadding=0 width="95%" border=1>
<TBODY>
<TR>
<TD align=center height="15" width="97">
<p style="margin-top: 0; margin-bottom: 0"><B><FONT size=2>Doc. Index No.</FONT></B></TD>
<TD align=middle height="15" width="532">
<p style="margin-top: 0; margin-bottom: 0"><B><FONT size=2>Document Title</FONT></B></TD>
<TD height="15" width="20" valign="top">
<p align="center" style="margin-top: 0; margin-bottom: 0"><font size="2"><b>
Revision
Date</b></font></TD>
</TR>
<TR>
<TD
style="PADDING-RIGHT: 4px; PADDING-LEFT: 4px; FONT-WEIGHT: 400; FONT-SIZE: 10pt; PADDING-BOTTOM: 1px; VERTICAL-ALIGN: bottom; COLOR: windowtext; PADDING-TOP: 1px; FONT-STYLE: normal; FONT-FAMILY: Arial; WHITE-SPACE: nowrap; TEXT-DECORATION: none"
align=center width=89 background=../default_files/none height=18>
<p style="margin-top: 0; margin-bottom: 0">&nbsp;</TD>
<TD
style="PADDING-RIGHT: 4px; PADDING-LEFT: 4px; FONT-WEIGHT: 400; FONT-SIZE: 10pt; PADDING-BOTTOM: 1px; VERTICAL-ALIGN: bottom; COLOR: windowtext; PADDING-TOP: 1px; FONT-STYLE: normal; FONT-FAMILY: Arial; WHITE-SPACE: nowrap; TEXT-DECORATION: none"
width=524 background=../default_files/none height=18>
<p style="margin-top: 0; margin-bottom: 0">No Documents</TD>
</TR></TBODY></TABLE></CENTER></DIV>

<p style="margin-top: 0; margin-bottom: 0">

<img border="0" src="../images/bullet2.gif" width="12" height="12">
<a onclick="openTable('table02'); return false;" href="">
Chapter 2 - Environmental</a> </p>
<p style="margin-top: 0; margin-bottom: 0"> </p>
<DIV align=center>
<CENTER>
<TABLE id=table02 style="DISPLAY: none; BORDER-COLLAPSE: collapse"
borderColor=#000000 cellSpacing=0 cellPadding=0 width="95%" border=1>
<TBODY>
<TR>
<TD align=center height="15" width="97">
<p style="margin-top: 0; margin-bottom: 0"><B><FONT size=2>Doc. Index No.</FONT></B></TD>
<TD align=middle height="15" width="532">
<p style="margin-top: 0; margin-bottom: 0"><B><FONT size=2>Document Title</FONT></B></TD>
<TD align=center height="15" width="20" valign="top">
<p style="margin-top: 0; margin-bottom: 0"><font size="2"><b>
Revision<br>
Date</b></font></TD>
</TR>
<TR>
<TD
style="PADDING-RIGHT: 4px; PADDING-LEFT: 4px; FONT-WEIGHT: 400; FONT-SIZE: 10pt; PADDING-BOTTOM: 1px; VERTICAL-ALIGN: bottom; COLOR: windowtext; PADDING-TOP: 1px; FONT-STYLE: normal; FONT-FAMILY: Arial; WHITE-SPACE: nowrap; TEXT-DECORATION: none"
align=center width=89 background=../default_files/none height=18>
<p style="margin-top: 0; margin-bottom: 0">&nbsp;</TD>
<TD
style="PADDING-RIGHT: 4px; PADDING-LEFT: 4px; FONT-WEIGHT: 400; FONT-SIZE: 10pt; PADDING-BOTTOM: 1px; VERTICAL-ALIGN: bottom; COLOR: windowtext; PADDING-TOP: 1px; FONT-STYLE: normal; FONT-FAMILY: Arial; WHITE-SPACE: nowrap; TEXT-DECORATION: none"
width=524 background=../default_files/none height=18>
<p style="margin-top: 0; margin-bottom: 0">No Documents</TD>
</TR></TBODY></TABLE></CENTER></DIV>

</BODY></HTML>

Bernard Marx

7:38 am on Apr 7, 2005 (gmt 0)

WebmasterWorld Senior Member 10+ Year Member



The <body> element's onload attribute is conflicting (& overriding) the window.onload defined in script. If you get rid of the onload attribute on the body it'll work again.

I don't know of any apps that will collect up commonly held style attributes, and turn them into stylesheet classes. Then again, just a little search & replace in your text editor should do it.

kaled

8:04 am on Apr 7, 2005 (gmt 0)

WebmasterWorld Senior Member 10+ Year Member



Deleted... other answers are more complete.

Kaled.

jereece

11:58 am on Apr 7, 2005 (gmt 0)

10+ Year Member



Success! Thank you so much.

Jim

 

Join The Conversation

Moderators and Top Contributors

Hot Threads This Week

  1. Home
  2. Forums Index
  3. Browser Side / JavaScript and AJAX 7:44 am May 14, 2026