473,765 Members | 2,086 Online
Bytes | Software Development & Data Engineering Community
+ Post

Home Posts Topics Members FAQ

How do I change the li class dynamically using a menu.html includefile?

MLD
PLEASE HELP!

I would like to include a UL as a menu, styled by an included CSS
Style Sheet.

The problem I am having is how do I dynamically set the "active" page
class using JavaScript to change each time I click on a new list
item? I have found a bunch of examples but none that really
accomplish what I need.

As I choose from the list, I want the current page selected, evm.htm
for example, to have the following automatically populate using JS so
that the included menu HTML would look like this after tab 2 is
selected:
<ul id="menu">
<li><a href="home.htm" >Home</a></li>
<li class="active"> <a href="evm.htm"> EVM</a></li>
<li><a href="finance.s html">Finance</a></li>
<li><a href="investmen ts.shtml">Inves tments</a></li>
<li><a href="OpsAdmin. shtml">Administ ration</a></li>
<li><a href="subsidiar ies.shtml">Subs idiaries</a></li>
</ul>

Home Page: index.shtml

Include File: <!--#include file="menu.html " -->

menu.html
<ul id="menu">
<li><a href="home.htm" >Home</a></li>
<li><a href="evm.htm"> EVM</a></li>
<li><a href="finance.s html">Finance</a></li>
<li><a href="investmen ts.shtml">Inves tments</a></li>
<li><a href="OpsAdmin. shtml">Administ ration</a></li>
<li><a href="subsidiar ies.shtml">Subs idiaries</a></li>
</ul>
CSS (separate file as well)
#menu {
float: right;
background: #fff url(../images/barul.gif) no-repeat bottom right;
color: #808080;
padding: 18px 1px 11px 0;
margin: 0;
}
#menu li{
list-style-type:none;
}

#menu li a{
color:#666;
background:url( baractive.gif) transparent top right no-repeat;
display:block;
padding:0 10px 0 0;
}
#menu li.active,
#menu li.over,
#menu li:hover
{
color: #0066FF;
background: #f8f8f8;
background-color: #EAEAEA;
}
#menu li strong,
ul#menu li.active a{
background: #fff url(../images/baractive_blue4 .gif) no-repeat bottom
left;
}
ul#menu li.over a,
ul#menu li:hover a
{
background: #fff url(../images/baractive_blue4 .gif) no-repeat bottom
left;
font-weight: bolder;
padding: 14px 18px 14px 18px;
color:#000000;
background-color: #FFFFFF;
text-decoration: none; background:none ;
}
Jan 2 '08 #1
3 4568
Response to MLD <ml*******@gmai l.com>:
PLEASE HELP!
That screams, "Please help me do my homework!"
I would like to include a UL as a menu, styled by an included CSS
Style Sheet.

The problem I am having is how do I dynamically set the "active"
page class using JavaScript to change each time I click on a new
list item? I have found a bunch of examples but none that really
accomplish what I need.

As I choose from the list, I want the current page selected,
evm.htm for example, to have the following automatically populate
using JS so that the included menu HTML would look like this after
tab 2 is selected:
Are you dynamically switching these tabs? If not, your issue is
server-side and you'd need to detect the current URL and apply the
class server-side.

Otherwise:

http://developer.mozilla.org/en/docs...ment.className

....should suffice.

--
-Lost
Remove the extra words to reply by e-mail. Don't e-mail me. I am
kidding. No I am not.
Jan 2 '08 #2
MLD said the following on 1/2/2008 12:36 PM:
>
You are not adding any value or ANSWERING my questions or showing me
HOW to do what I need to do... All you are doing is pointing out what
I am doing wrong.

thanks anyway.
Umm, go slap yourself and wake up. This is Usenyt, you ask a question,
it gets discussed. If you get an answer, great. If you don't, then you
don't. This is not your personal help desk.
TGFY.

--
Randy
Chance Favors The Prepared Mind
comp.lang.javas cript FAQ - http://jibbering.com/faq/index.html
Javascript Best Practices - http://www.JavascriptToolbox.com/bestpractices/
Jan 2 '08 #3
MLD
You know what, you can all go and have a WONDERFUL day! If you don't
have anything nice to say, why don't you keep your big mouth shut.
If you don't have an answer, don't use this board to harass people
with your unresolved anger issues.

I am not looking for a personal help desk, I am looking for someone
who might have a simple answer which I already figured out in between
this nonsense.

You must be male and on most days spending most of your time alone.

I will now drop this post and you can say whatever else you want and I
am not going to read it, so save all your sarcasm and useless words
for someone who actually cares...

happy new year to you
xoxo
On Jan 2, 12:47 pm, Randy Webb <HikksNotAtH... @aol.comwrote:
MLD said the following on 1/2/2008 12:36 PM:
You are not adding any value or ANSWERING my questions or showing me
HOW to do what I need to do... All you are doing is pointing out what
I am doing wrong.
thanks anyway.

Umm, go slap yourself and wake up. This is Usenyt, you ask a question,
it gets discussed. If you get an answer, great. If you don't, then you
don't. This is not your personal help desk.
TGFY.

--
Randy
Chance Favors The Prepared Mind
comp.lang.javas cript FAQ -http://jibbering.com/faq/index.html
Javascript Best Practices -http://www.JavascriptT oolbox.com/bestpractices/
Jan 2 '08 #4

This thread has been closed and replies have been disabled. Please start a new discussion.

Similar topics

2
1942
by: KnotKnormal | last post by:
I would like to dynamically load a HTML page (or a Word document), which is embedded in a table when the user clicks on a hyperlink to go from HTML page one to HTML page two. For example, I would like the secretary at a school to update a Word document concerning homework assignments. This Word document would reside on the server. When changes are made it, these changes are automatically updated to the web page. This would simplify life...
1
1403
by: KB | last post by:
My fellow virtual friends, allow me to ask for your collaboration with this simple yet not-so-trivial matter, My application has a menu which is defined and stored in a database. This menu will be part of any page. Currently I implemented it as a user control which gets the menu from the database and then converts it into the html code, which is then displayed in each page. For some reason I have a feeling that it's not very smart to...
1
3139
by: CS Wong | last post by:
Hi, I have a page form where form elements are created dynamically using Javascript instead of programatically at the code-behind level. I have problems accessing the dynamically-created elements and would like to seek a solution for this. I had looked through several articles for accessing programatically-created dynamic elements such as: 1)
15
2419
by: Joe Fallon | last post by:
I would like to know how you can figure out how much memory a given instance of a class is using. For example, if I load a collection class with 10 items it might use 1KB, and if I load it with 1000 items it might use 100KB. How do I measure the amount of memory used once the class is loaded? Thanks! -- Joe Fallon
0
2475
by: gen | last post by:
Hi everybody, We would like to use localization in order to translate our applications. The working environment of the users is very bilingual so they often have to switch from one language to another. So far we have been using the resource files. But using the localization would be easier to design our forms. But the users are use to be able to change the language anytime they want in the application without having to restart the...
2
2313
by: jack | last post by:
Hello, I need to dynamically add menu items to an existing menu on an MDI form. In the form load, when I create the menu items then add it to the menu control using the Add method, the entire menu dissappears. Any one know why? Below is the code I'm using to create the menu items and append them to the existing menu: Dim aDatasheets As ArrayList = gOSSystemFile.Datasheets
2
1524
dmjpro
by: dmjpro | last post by:
i want change the color using R,G and B colors dynamically.. is there any function RGB .. or anything else ... plz help .. thanxxx in advance
3
14294
by: itsSase | last post by:
Is there any way to change a Div ID - dynamically using Javascript...?????
1
2228
by: manontheedge | last post by:
I'm trying to create multiple instances of a class dynamically. For example ... Class A { ... ... };
0
10153
Oralloy
by: Oralloy | last post by:
Hello folks, I am unable to find appropriate documentation on the type promotion of bit-fields when using the generalised comparison operator "<=>". The problem is that using the GNU compilers, it seems that the internal comparison operator "<=>" tries to promote arguments from unsigned to signed. This is as boiled down as I can make it. Here is my compilation command: g++-12 -std=c++20 -Wnarrowing bit_field.cpp Here is the code in...
0
10007
jinu1996
by: jinu1996 | last post by:
In today's digital age, having a compelling online presence is paramount for businesses aiming to thrive in a competitive landscape. At the heart of this digital strategy lies an intricately woven tapestry of website design and digital marketing. It's not merely about having a website; it's about crafting an immersive digital experience that captivates audiences and drives business growth. The Art of Business Website Design Your website is...
1
9946
by: Hystou | last post by:
Overview: Windows 11 and 10 have less user interface control over operating system update behaviour than previous versions of Windows. In Windows 11 and 10, there is no way to turn off the Windows Update option using the Control Panel or Settings app; it automatically checks for updates and installs any it finds, whether you like it or not. For most users, this new feature is actually very convenient. If you want to control the update process,...
0
8830
agi2029
by: agi2029 | last post by:
Let's talk about the concept of autonomous AI software engineers and no-code agents. These AIs are designed to manage the entire lifecycle of a software development project—planning, coding, testing, and deployment—without human intervention. Imagine an AI that can take a project description, break it down, write the code, debug it, and then launch it, all on its own.... Now, this would greatly impact the work of software developers. The idea...
1
7371
isladogs
by: isladogs | last post by:
The next Access Europe User Group meeting will be on Wednesday 1 May 2024 starting at 18:00 UK time (6PM UTC+1) and finishing by 19:30 (7.30PM). In this session, we are pleased to welcome a new presenter, Adolph Dupré who will be discussing some powerful techniques for using class modules. He will explain when you may want to use classes instead of User Defined Types (UDT). For example, to manage the data in unbound forms. Adolph will...
0
5272
by: TSSRALBI | last post by:
Hello I'm a network technician in training and I need your help. I am currently learning how to create and manage the different types of VPNs and I have a question about LAN-to-LAN VPNs. The last exercise I practiced was to create a LAN-to-LAN VPN between two Pfsense firewalls, by using IPSEC protocols. I succeeded, with both firewalls in the same network. But I'm wondering if it's possible to do the same thing, with 2 Pfsense firewalls...
0
5413
by: adsilva | last post by:
A Windows Forms form does not have the event Unload, like VB6. What one acts like?
1
3921
by: 6302768590 | last post by:
Hai team i want code for transfer the data from one system to another through IP address by using C# our system has to for every 5mins then we have to update the data what the data is updated we have to send another system
2
3530
muto222
by: muto222 | last post by:
How can i add a mobile payment intergratation into php mysql website.

By using Bytes.com and it's services, you agree to our Privacy Policy and Terms of Use.

To disable or enable advertisements and analytics tracking please visit the manage ads & tracking page.