[RESOLVED] Change background color of link onclick

OK, this should be simple but I can't work out how to do it. I have a frames site where the left hand pane has a menu page with links. When I click on one of my links I want to change the background color of the link (or even just the text color) to highlight the fact that it has just been clicked and remind the user which page they are viewing in the right hand frame (in case they forget....users!!!!).

I've worked out how to change the document bgColor but can't get it to work for a single control.

Quote:

---

Originally Posted by Uncle Bob

OK, this should be simple but I can't work out how to do it. I have a frames site where the left hand pane has a menu page with links. When I click on one of my links I want to change the background color of the link (or even just the text color) to highlight the fact that it has just been clicked and remind the user which page they are viewing in the right hand frame (in case they forget....users!!!!).

I've worked out how to change the document bgColor but can't get it to work for a single control.

---

This turns hyperlink text red after the click. Your href may be different.

PHP Code:

---

<a id="link" href="javascript:void(0);" onclick="this.style.color='#ff0000'">Link</a> 


---

Quote:

---

Originally Posted by wey97

This turns hyperlink text red after the click. Your href may be different.

PHP Code:

---

<a id="link" href="javascript:void(0);" onclick="this.style.color='#ff0000'">Link</a> 


---

---

Never use on* attributes. Always keep scripting and document structure separate.

It sounds to me like the OP simply wants the :active and/or :visited pseudo-classes:

Code:

---

a { color: blue; }
a:visited { color: red; }
a:active { color: green; }

---

Actually Wey97 was right the first time, the problem with using a different visited link color is that it will stay that color after a refresh which I don't want.

Thanks guys, simple but I couldn't find the right keywords to use myself.

Quote:

---

Originally Posted by penagate

Never use on* attributes. Always keep scripting and document structure separate.

---

That was just a quick hint for the OP to do what he wanted to do. It would be up to him to separate his code and doc structure.

Anyway, it would be better to put the script into a .js file so if you ever decide you want to change the color of what the clicked links look like, you don't have to recode every click event.

Remember if you want to keep track of the last link clicked, you need to reset the color of the other links back to default on the click of a new link. Otherwise, after the second link that's clicked, the user can't keep track of the last link clicked, which defeats the purpose.

Quote:

---

Originally Posted by Uncle Bob

Actually Wey97 was right the first time, the problem with using a different visited link color is that it will stay that color after a refresh which I don't want.

---

Why not?

Quote:

---

Quote:
Originally Posted by Uncle Bob
Actually Wey97 was right the first time, the problem with using a different visited link color is that it will stay that color after a refresh which I don't want.


Why not?

---

There are a number of links in my left hand pane and I only want the last one clicked to be highlighted, whereas using the visited link colour option will leave every link clicked a different colour instead of just the last.

It's clear in my head anyway!

This is why you shouldn't use frames, it only leads to headaches.

If you have the page all in one proper document then you can easily give the current page link a CSS ID or class name to identify it.

Agreed, Frames is useless. This wasn't my project originally so I'm having to work with somebody elses design. It's my first web project as well so I'm not in the mood to rewrite the whole thing either. Works well most of the time.