Hyperlinks

Crabs · 13th March 2003, 03:04 PM

Does anyone know how to code a hyperlink so that when you put the mouse pointer over it it changes colour using html?

Red_Baron · 13th March 2003, 03:34 PM

stylesheets is the easiest way to do it

<style>
a:hover { color : "yellow"}
a:link { color:"blue"}
a:visited{ color:"red"}
</style>

that's just off the top of my head. Best to check a stylesheet or html reference

You could also write a javascript function that takes the anchor tag id or name as an argument and changes the color of the anchor.

You'd then call this function using the anchor mouseOver event. Of course you'd have to write another function for the mouseOut event as well.

I'd recomend the sytle's though. Just copy that style block I've written and put it in the head seaction of your page.

NB: You can youse rgb color codes or hex codes as well.

Red_Baron · 13th March 2003, 04:20 PM

I've just had a look at your code. You'll have to remove all the <font> tags as they'll overide your anchor styles. You'd be best setting the styles for these anchors using a style sheet as well

a {font-style:"......."}

something like that.

Then put all the hover, visited stuff below it. It'll only be 4 or 5 lines much better than all those font tags.

hope that helps

Crabs · 16th March 2003, 05:52 PM

cheers mikey, I'll give it a try and see how it goes!

kj · 16th March 2003, 05:57 PM

best use specific hex codes for colours in the style sheet though, and try and keep em web save (216 colours) but i tend not to

Crabs · 16th March 2003, 09:05 PM

BINGO!!!

Cheers guys I got it working like a treat! The only other thing I had to do that you didn't mention was add an extra a:hover {color : "#ffffff"} underneath a:visited {color : "#ff0000"} because the color was only changing on links that hadn't been visited! Doin that sorted it though!

Cheers Again

Red_Baron · 17th March 2003, 11:16 AM

you shouldn't have to do that, maybe a bug in IE so long as it's working.

13th March 2003, 03:04 PM	#1 (permalink)
Crabs Registered User Join Date: May 2002 Location: Stirling Posts: 174	Hyperlinks Does anyone know how to code a hyperlink so that when you put the mouse pointer over it it changes colour using html?

13th March 2003, 03:34 PM	#2 (permalink)
Red_Baron Senior Member Join Date: Apr 2002 Location: Dundee/Alyth hybrid Posts: 1,491 Band: 15 Minutes	stylesheets is the easiest way to do it <style> a:hover { color : "yellow"} a:link { color:"blue"} a:visited{ color:"red"} </style> that's just off the top of my head. Best to check a stylesheet or html reference You could also write a javascript function that takes the anchor tag id or name as an argument and changes the color of the anchor. You'd then call this function using the anchor mouseOver event. Of course you'd have to write another function for the mouseOut event as well. I'd recomend the sytle's though. Just copy that style block I've written and put it in the head seaction of your page. NB: You can youse rgb color codes or hex codes as well. Last edited by Red_Baron : 13th March 2003 at 04:00 PM.

16th March 2003, 05:57 PM	#5 (permalink)
kj gimp Join Date: Aug 2001 Location: Scotland Posts: 13,935 Band: A band of merry men	best use specific hex codes for colours in the style sheet though, and try and keep em web save (216 colours) but i tend not to __________________ This community cannot survive without your continued support. galleries \|\| links directory \|\| profiles \|\| wiki

Thread Tools
Show Printable Version Email this Page
Display Modes
Linear Mode Switch to Hybrid Mode Switch to Threaded Mode

13th March 2003, 04:20 PM	#3 (permalink)
Red_Baron Senior Member Join Date: Apr 2002 Location: Dundee/Alyth hybrid Posts: 1,491 Band: 15 Minutes	I've just had a look at your code. You'll have to remove all the <font> tags as they'll overide your anchor styles. You'd be best setting the styles for these anchors using a style sheet as well a {font-style:"......."} something like that. Then put all the hover, visited stuff below it. It'll only be 4 or 5 lines much better than all those font tags. hope that helps

16th March 2003, 05:52 PM	#4 (permalink)
Crabs Registered User Join Date: May 2002 Location: Stirling Posts: 174	cheers mikey, I'll give it a try and see how it goes!

16th March 2003, 09:05 PM	#6 (permalink)
Crabs Registered User Join Date: May 2002 Location: Stirling Posts: 174	BINGO!!! Cheers guys I got it working like a treat! The only other thing I had to do that you didn't mention was add an extra a:hover {color : "#ffffff"} underneath a:visited {color : "#ff0000"} because the color was only changing on links that hadn't been visited! Doin that sorted it though! Cheers Again

17th March 2003, 11:16 AM	#7 (permalink)
Red_Baron Senior Member Join Date: Apr 2002 Location: Dundee/Alyth hybrid Posts: 1,491 Band: 15 Minutes	you shouldn't have to do that, maybe a bug in IE so long as it's working.