Velocity Reviews - Computer Hardware Reviews

Velocity Reviews > Newsgroups > Programming > Javascript > change text color of a link with onclick event

Reply
Thread Tools

change text color of a link with onclick event

 
 
Matt
Guest
Posts: n/a
 
      02-10-2004
I created 3 hyperlinks, when the user click each link, it will change
the color of the text of a link. For example, when user clicks Link1,
text Link1 will become red color, but Link2 and Link3 unchange. Here's
my attempts, any ideas??

<script language="javascript">
function changecolor (i)
{
document.i.fontcolor = red;
}
</script></head><a name="item1" href="test.html"
onClick='changecolor(item1)'>Link 1</a><a name="item2"
href="test.html" onclick='changecolor(item2)'>Link 2</a><a
name="item3" href="test.html" onclick='changecolor(item3)'>Link 3</a>
 
Reply With Quote
 
 
 
 
Brian Genisio
Guest
Posts: n/a
 
      02-11-2004
Matt wrote:
> I created 3 hyperlinks, when the user click each link, it will change
> the color of the text of a link. For example, when user clicks Link1,
> text Link1 will become red color, but Link2 and Link3 unchange. Here's
> my attempts, any ideas??
>
> <script language="javascript">
> function changecolor (i)
> {
> document.i.fontcolor = red;
> }
> </script></head><a name="item1" href="test.html"
> onClick='changecolor(item1)'>Link 1</a><a name="item2"
> href="test.html" onclick='changecolor(item2)'>Link 2</a><a
> name="item3" href="test.html" onclick='changecolor(item3)'>Link 3</a>


Hmmmm... Where do I begin...
1. You close the head, but do not create a body
2. I recommend putting the text you want to change in a FONT tag
3. The document.i technique is no good. Use getElementById or all
4. The font color needs to be "red", not red.
....

Well, here is a re-write. It works:

<HTML>
<HEAD>
<script language="javascript">
function changecolor (i)
{
if(document.getElementById)
document.getElementById(i).color = "red";
else if(document.all)
document.all[i].color = "red";

// makes it so the page does not go to test.html
return false;
}
</script>
</head>

<BODY>
<a href="test.html" onClick='return changecolor("item1")'><font
id=item1> Link 1</font></a>
<a href="test.html" onclick='return changecolor("item2")'><font
id=item2> Link 2</font></a>
<a href="test.html" onclick='return changecolor("item3")'><font
id=item3> Link 3</font></a>
</BODY>
</HTML>

 
Reply With Quote
 
 
 
 
Bas Cost Budde
Guest
Posts: n/a
 
      02-12-2004
Brian Genisio wrote:

> 2. I recommend putting the text you want to change in a FONT tag


Why? SPAN will do.
--
Bas Cost Budde
http://www.heuveltop.org/BasCB
but the domain is nl

 
Reply With Quote
 
Brian Genisio
Guest
Posts: n/a
 
      02-12-2004
Bas Cost Budde wrote:

> Brian Genisio wrote:
>
>> 2. I recommend putting the text you want to change in a FONT tag

>
>
> Why? SPAN will do.



Because FONT was the first thing that came to mind, and is most
intuitive. What's wrong with FONT?

Brian

 
Reply With Quote
 
Bas Cost Budde
Guest
Posts: n/a
 
      02-12-2004
Brian Genisio wrote:

> Because FONT was the first thing that came to mind, and is most
> intuitive. What's wrong with FONT?
>

<nagging voice> It's deprecated. </nagging voice> Nothing, really.
Although I prefer to use tags to indicate meaning. This sample is
changing font properties, so who's to judge?

BTW could you also use

<a href="test.html" onClick='return changecolor(this)'>

instead of your proposed

<a href="test.html" onClick='return changecolor("item1")'>

?

--
Bas Cost Budde
http://www.heuveltop.org/BasCB
but the domain is nl

 
Reply With Quote
 
Michael Winter
Guest
Posts: n/a
 
      02-12-2004
On Thu, 12 Feb 2004 08:28:10 -0500, Brian Genisio <(E-Mail Removed)>
wrote:

> Bas Cost Budde wrote:
>
>> Brian Genisio wrote:
>>
>>> 2. I recommend putting the text you want to change in a FONT tag

>>
>> Why? SPAN will do.

>
> Because FONT was the first thing that came to mind, and is most
> intuitive. What's wrong with FONT?


It's deprecated and has been for almost the past 7 years, along with
virtually every other presentational feature in HTML[1].

CSS 1 is widely supported and provides most of the functionality that
"presentational HTML" once had. CSS 2, though less supported, provides
more functionality than HTML once had.

Mike


[1] The only ones that remain can be argued to be structural elements that
have a presentational side effect.

--
Michael Winter
http://www.velocityreviews.com/forums/(E-Mail Removed)d (replace ".invalid" with ".uk" to reply)
 
Reply With Quote
 
 
 
Reply

Thread Tools

Posting Rules
You may not post new threads
You may not post replies
You may not post attachments
You may not edit your posts

BB code is On
Smilies are On
[IMG] code is On
HTML code is Off
Trackbacks are On
Pingbacks are On
Refbacks are Off


Similar Threads
Thread Thread Starter Forum Replies Last Post
change text color onclick, and change it back - will post to DB apparker Javascript 10 04-03-2007 01:57 PM
link hover color not honored when using onclick event Richard Thoms HTML 6 12-02-2005 02:55 AM
Change text color for one document.write but not color of all text? kroger@princeton.edu Javascript 7 02-02-2005 01:23 PM
how to change link.text color dynamically ? irma Javascript 0 09-30-2003 01:17 AM
Change text color of "visited link" back to unvisited color ??? Matt Adams HTML 0 08-26-2003 10:27 AM



Advertisments