Personally, I think it's better to do this with PHP, but you can do it without using PHP.
It's all about the cascade. Say your menu looks like this...
HTML
<ul>
<li><a href="one.htm">first page</a></li>
<li><a href="two.htm">number two</a></li>
<li><a href="three.htm">third</a></li>
<li><a href="four.htm">page four</a></li>
<li><a href="five.htm">five</a></li>
<li><a href="six.htm">sixsixsix</a></li>
<li><a href="seven.htm">SEVEN</a></li>
<li><a href="eight.htm">eighth page</a></li>
<li><a href="nine.htm">NiNe</a></li>
<li><a href="ten.htm">TEN!</a></li>
</ul>
First, add an id to each list item. Something like this...
HTML
<ul>
<li id="i1"><a href="one.htm">first page</a></li>
<li id="i2"><a href="two.htm">number two</a></li>
<li id="i3"><a href="three.htm">third</a></li>
<li id="i4"><a href="four.htm">page four</a></li>
<li id="i5"><a href="five.htm">five</a></li>
<li id="i6"><a href="six.htm">sixsixsix</a></li>
<li id="i7"><a href="seven.htm">SEVEN</a></li>
<li id="i8"><a href="eight.htm">eighth page</a></li>
<li id="i9"><a href="nine.htm">NiNe</a></li>
<li id="i10"><a href="ten.htm">TEN!</a></li>
</ul>
After that, you give each body tag an id too, so on page one, you can have something like this...
HTML
<body id="p1">
<ul>
<li id="i1"><a href="one.htm">first page</a></li>
<li id="i2"><a href="two.htm">number two</a></li>
<li id="i3"><a href="three.htm">third</a></li>
<li id="i4"><a href="four.htm">page four</a></li>
<li id="i5"><a href="five.htm">five</a></li>
<li id="i6"><a href="six.htm">sixsixsix</a></li>
<li id="i7"><a href="seven.htm">SEVEN</a></li>
<li id="i8"><a href="eight.htm">eighth page</a></li>
<li id="i9"><a href="nine.htm">NiNe</a></li>
<li id="i10"><a href="ten.htm">TEN!</a></li>
</ul>
<p>one</p>
</body>
Of course, page two would be p2, page three - p3, etc.
By using the cascade, you can set a style for list item 1 on page 1, list item 2 on page 2, etc. The CSS would look something like this:
CSS
#p1 #i1 a,
#p2 #i2 a,
#p3 #i3 a,
#p4 #i4 a,
#p5 #i5 a,
#p6 #i6 a,
#p7 #i7 a,
#p8 #i8 a,
#p9 #i9 a,
#p10 #i10 a {
color:red;
}
Thanks Bon Rouge! Took me an hour to find your advice, but it fills the huge gap that everyone fails to explain when trying to make a universal menu that is easily programmable for specific pages. My challenge was to hilite a specific menu item ( eg. list item ) using identical menu code throughout the many pages in my web-site!
Thanks. Merci. Gracias.
HI Bon Rouge!
Can you provide me the php code of this kind as i have .php pages.
As my menu item contains the images and i want to have a hover effect on particular menu.
Eg.: i have 5 menu items when user click one of them it should get selected with the hover effect.
I hope so you got my point.
A help would be greatly appriciated.
Thanks in advance
Here is my personal Email-id : vishal3184@gmail.com
This works with full pages - does anyone have a solution for dynamic pages where the internal of the pages changes but uses the same <body id> element? I've tried to do this below the body element and have not found a solution yet.
It is very good.... thanks
thanks man, thats awesome!!!!
how to do it without using <li> tag
NG,
You would put the ids into whatever tags you're using.
This is quite wonderfuuuuuuul! I had suffered for long.
how to essay <a href="https://essaymerino.com/ ">freedom of speech essay</a> claim in an essay
order essay cheap <a href="https://essaymeson.com/ ">essay titles</a> college essay help
what are furosemide tablets for <a href="https://lasixona.com/ ">lasix vs furosemide</a> furosemide generic for lasix
Wow, that's a great idea. I ended up writing an ugly if/else mess for mine when I could've just used this