Hi everyone, I am using the following code to create tabs on one of my webpages and I am curious if there is anyway to link from another page directly to one tab, so the patron won't have to come to this page and then find the tab they need. I tried adding 'a name="#somename"' to the tab information, but that isn't working. Unfortunately, I don't have option of creating PHP pages because I just found out that our server doesn't have activated support for PHP. Any ideas? All input is greatly appreciated and I am desperate! Here is the tab code by itself: <ul class="tabselector" id="tabcontrol1"> <li class="tab-selected" id="db_tab"> <a href="#" onclick="tabselect($('db_tab')); paneselect($('db_pane')); return false;">Parkland Health Sciences Library</a></li> <li class="tab-unselected" id="art_tab"> <a href="#" a name="#computer" onclick="loadPane($('art_pane'), 'psudo-noteslist.php'), tabselect($('art_tab')); paneselect($('art_pane')); return false;">Presbyterian Health Sciences Library</a></li> <li class="tab-unselected" id="sub_tab"> <a href="#" onclick="loadPane($('sub_pane'), 'psudo-noteslist.php'), tabselect($('sub_tab')); paneselect($('sub_pane')); return false;">Houston Health Sciences Librarian</a></li> </ul> Here is all the of code together: <script type="text/javascript"> function tabselect(tab) { var tablist = $('tabcontrol1').getElementsByTagName('li'); var nodes = $A(tablist); var lClassType = tab.className.substring(0, tab.className.indexOf('-') ); nodes.each(function(node){ if (node.id == tab.id) { tab.className=lClassType+'-selected'; } else { node.className=lClassType+'-unselected'; }; }); } function paneselect(pane) { var panelist = $('panecontrol1').getElementsByTagName('li'); var nodes = $A(panelist); nodes.each(function(node){ if (node.id == pane.id) { pane.className='pane-selected'; } else { node.className='pane-unselected'; }; }); } function loadPane(pane, src) { if (pane.innerHTML=='' || pane.innerHTML=='<img alt="Wait" src="images/loading.gif" style="vertical-align:-3px" /> Loading...') { reloadPane(pane, src); } } function reloadPane(pane, src) { new Ajax.Updater(pane, src, {asynchronous:1, evalScripts:true, onLoading:function(request){pane.innerHTML='<img alt="Wait" src="images/loading.gif" style="vertical-align:-3px" /> Loading...'}}) } </script> <div id="preview_area"> <ul class="tabselector" id="tabcontrol1"> <li class="tab-selected" id="db_tab"> <a href="#" onclick="tabselect($('db_tab')); paneselect($('db_pane')); return false;">Parkland Health Sciences Library</a></li> <li class="tab-unselected" id="art_tab"> <a href="#" a name="#computer" onclick="loadPane($('art_pane'), 'psudo-noteslist.php'), tabselect($('art_tab')); paneselect($('art_pane')); return false;">Presbyterian Health Sciences Library</a></li> <li class="tab-unselected" id="sub_tab"> <a href="#" onclick="loadPane($('sub_pane'), 'psudo-noteslist.php'), tabselect($('sub_tab')); paneselect($('sub_pane')); return false;">Houston Health Sciences Librarian</a></li> </ul> <div id="text"> <ul class="panes" id="panecontrol1"> <li id="db_pane" class="pane-selected"> <IMG STYLE="position:absolute; TOP:260px; LEFT:600px; width:228; height:200;" SRC="images/park1.jpg"><br /> <table width="448" border="0"> <tr> <th width="235" align="left" scope="col">Contact Information:</th> <th width="203" align="left" scope="col">Librarian:</th> </tr> <tr> <td>TWU Health Sciences Library</td> <td>Eula Oliphant</td> </tr> <tr> <td>Parkland Campus</td> <td>214-689-6585</td> </tr> <tr> <td>1810 Inwood Rd.</td> <td><a href="mailto:eoliphant@mail.twu.edu">Eula Oliphant</a></td> </tr> </table> <br /><br /> <table width="500" border="0"> <tr> <td width="233"><a href="http://www.twu.edu/library/about/about_pkmap.htm">Map</a></td> <td width="257"><a href="http://twuill.twu.edu/libweb/web/res/nursing_guide.htm">Nursing Resources</a></td> </tr> <tr> <td><a href="http://twuill.twu.edu/libweb/web/hours.htm">Hours</a></td> <td><a href="http://twuill.twu.edu/libweb/web/res/hs_guide.htm">Health Studies Resources</a></td> </tr> <tr> <td><a href="http://twuill.twu.edu/libweb/web/research/subject_specialists.htm">Request Personalized Instruction</a></td> <td><a href="http://twuill.twu.edu/libweb/web/res/ready.htm">Internet Reference</a></td> </tr> <tr> <td>Library Instruction Workshops</td> <td><a href="http://twuill.twu.edu/libweb/web/services/services_faq.htm">Library Cards & TexShare Information</a></td> </tr> </table> </li> <li id="art_pane" class="pane-unselected"> <IMG STYLE="position:absolute; TOP:280px; LEFT:600px;" SRC="images/presby2.jpg"><br /> <table width="448" border="0"> <tr> <th width="235" align="left" scope="col">Contact Information:</th> <th width="203" align="left" scope="col">Librarian:</th> </tr> <tr> <td>TWU Health Sciences Library</td> <td> Elaine Cox</td> </tr> <tr> <td> Presbyterian Campus</td> <td> DPH Room 24</td> </tr> <tr> <td> 8194 Walnut Hill Lane</td> <td> 214-706-2390</td> </tr> <tr> <td> Dallas, Texas 75231</td> <td><a href="mailto:ecox@mail.twu.edu">Elaine Cox</a></td> </tr> <tr> <td> 214-706-2395</td> <td></td> </tr> </table> <br /><br /> <table width="500" border="0"> <tr> <td width="233"><a href="http://www.twu.edu/library/about/about_pkmap.htm">Map</a></td> <td width="257"><a href="http://twuill.twu.edu/libweb/web/res/ot_guide.htm">Occupational Therapy</a></td> </tr> <tr> <td><a href="http://twuill.twu.edu/libweb/web/hours.htm">Hours</a></td> <td><a href="http://twuill.twu.edu/libweb/web/res/pt_guide.htm">Physical Therapy</a></td> </tr> <tr> <td><a href="http://twuill.twu.edu/libweb/web/research/subject_specialists.htm">Request Personalized Instruction</a></td> <td><a href="http://twuill.twu.edu/libweb/web/res/ready.htm">Internet Reference</a></td> </tr> <tr> <td>Library Instruction Workshops</td> <td><a href="http://twuill.twu.edu/libweb/web/services/services_faq.htm">Library Cards & TexShare Information</a></td> </tr> </table> </li> <li id="sub_pane" class="pane-unselected"> <IMG STYLE="position:absolute; TOP:260px; LEFT:600px; " SRC="images/houston.jpg"><br /> <table width="448" border="0"> <tr> <th width="235" align="left" scope="col">Contact Information:</th> <th width="203" align="left" scope="col">Librarian:</th> </tr> <tr> <td>Institute of Health Sciences</td> <td>Marilyn Goff </td> </tr> <tr> <td>Academic Resource Center</td> <td>713-794-2481</td> </tr> <tr> <td>6700 Fannin</td> <td>Fax: 713-794-2484</td> </tr> <tr> <td>Houston , Texas 77030-4132</td> <td><a href="mgoff@mail.twu.edu">Marilyn Goff</a></td> </tr> </table> <br /><br /> <table width="500" border="0"> <tr> <td width="233"><a href="http://www.twu.edu/library/about/about_pkmap.htm">Map</a></td> <td><a href="http://twuill.twu.edu/libweb/web/res/hs_guide.htm">Health Studies Resources</a></td> </tr> <tr> <td><a href="http://twuill.twu.edu/libweb/web/hours.htm">Hours</a></td> <td width="257"><a href="http://twuill.twu.edu/libweb/web/res/nursing_guide.htm">Nursing Resources</a></td> </tr> <tr> <td><a href="http://twuill.twu.edu/libweb/web/research/subject_specialists.htm">Request Personalized Instruction</a></td> <td><a href="http://twuill.twu.edu/libweb/web/res/ot_guide.htm">Occupational Therapy</a></td> </tr> <tr> <td>Library Instruction Workshops</td> <td><a href="http://twuill.twu.edu/libweb/web/res/pt_guide.htm">Physical Therapy</a></td> </tr> <tr> <td></td> <td><a href="http://twuill.twu.edu/libweb/web/res/ready.htm">Internet Reference</a></td> </tr> </table> </li> </ul> </div> </div> Code (markup):
This one might works. For example: On the first page <a href='where.html#tab1'>Link</a> PHP: Then, on the destination page: <script type="text/javascript"> window.onload = function() { var loc = unescape(window.document.location); var tab = loc.split("#"); var obj = document.getElementById(tab[1]); obj.style.display = 'block'; } </script> <div id="tab1" style="display:none">One</div> <div id="tab2" style="display:none">Two</div> <div id="tab3" style="display:none">Three</div> PHP: