Groups | Search | Server Info | Keyboard shortcuts | Login | Register [http] [https] [nntp] [nntps]

Groups > comp.lang.javascript > #25187

external javascript menu - highlight current page

Show all headers | View raw

Hi,

My website works using a javascript menu in an external file like the following

The javascript JsMenuShowFile.js
----------------------------------
function JsMenuShow(){
	document.write('<ul>');
	document.write('<li id="Li_style1"><a id="a_style1" href="link1_item.html">link1 page</a></li>');
	document.write('<li id="Li_style1"><a id="a_style1" href="link2_item.html">link2 page</a></li>');	
	document.write('</ul>');
	document.write('<li id="Li_style1"><a id="a_style1" href="link3_item.html">link3 page</a></li>');	
	document.write('</ul>');
	return this;
}

if(document.URL.indexOf("link1_item.html")!=-1){
	JsMenuShow();
}

if(document.URL.indexOf("link2_item.html")!=-1){
	JsMenuShow();
}

And the html page to display these items
------------------------------------------
<script language="JavaScript" type="text/javascript" src="JsMenuShowFile.js"></script><noscript><p id="DisabledJs">Your browser does not support JavaScript</p>
<p>Refer to <a href="info.html">Infos</a> for additional information</p></noscript>

My primary query is how to highlight* the current page with this menu?

My own answer to this would be to change JsMenuShow() into something different other than document.write. I know a little javascript mainly through other programming languages exposure. Has someone experienced a script similar to this? 

Would this create more overheads on the client computer as the menu is a recurring process for every page?

My second query requires additional skills as it's about highlighting* the menu above (or the parent menu as it's known I think). But the menu file works using relative links so it's unlikely javascript can find the parent menu from nowhere.

Illustration
	...
	document.write('<li id="Li_style1"><a id="a_style1" href="link1_item.html">link1 page</a></li>');
	document.write('<li id="Li_SubStyle1a"><a id="a_SubStyle1a" href="link1_subItem1.html">link1 sub page</a></li>');

As it shows, the upper parent menu is within the <li> tags as link1_item.html and the child parent menu is link1_subItem1.html

How to deal with the first query knowing that it's likely the second query will arise any time later?

Thanks,
Pascal

Back to comp.lang.javascript | Previous | Next — Next in thread | Find similar | Unroll thread

Thread

external javascript menu - highlight current page ba pal <bpascal362@gmail.com> - 2014-07-02 01:17 -0700
  Re: external javascript menu - highlight current page ba pal <bpascal362@gmail.com> - 2014-07-02 01:19 -0700
  Re: external javascript menu - highlight current page "Evertjan." <exxjxw.hannivoort@inter.nl.net> - 2014-07-02 11:48 +0200
  Re: external javascript menu - highlight current page Christoph Michael Becker <cmbecker69@arcor.de> - 2014-07-02 22:35 +0200

csiph-web