Text colour change - Rollover

roach · 08-24-2004, 11:53 AM

OK, so this question has probably been asked about a million times before in here but I'm a sad lowly UK newbie web designer so please take pity!!

I have a current project where I need some link text to change colour (from white to grey specifically!) when the mouse rolls over it. Tried the flash way, could get it to change colour but how the hell do you get to add the link?????? Or is there an easier way.....because I just love easy solutions!

HELP PLEASE!!!!!

Dan

Jazzee · 08-24-2004, 11:58 AM

Use CSS.

For the link, put this:
<a class="colorchange" href="link.html">

In your stylesheet, put this:

a.colorchange {color: #ffffff;}
a.colorchange:hover {color: #333333;}

Jazzee · 08-24-2004, 11:59 AM

PS. If you don't have a stylesheet, put this in the <head> section of your page:

<style type="text/css">
a.colorchange {color: #ffffff;}
a.colorchange:hover {color: #333333;}
</style>

roach · 08-24-2004, 01:07 PM

Jazzee,

Cheers for the help, but pardon my complete ignorance, Is it simply a case of pasting that code into my script?? I'm using Dreamweaver MX...

Jazzee · 08-24-2004, 01:19 PM

Go to your html view. Find the links you want to change and add class="colorchange" into the link so it looks like this:
[code:1:046f610bea]<a class="colorchange" href="YOURPAGE.HTML"> [/code:1:046f610bea]
(YOURPAGE.HTML will be whatever is already there)

Then look at the top of the page in html view. See if you have a stylesheet. (You'll recognize it by the <style type="text/css">)

If you have that, put this in there:
[code:1:046f610bea]a.colorchange {color: #ffffff;}
a.colorchange:hover {color: #333333;} [/code:1:046f610bea]

If not, put this right under <head>:
[code:1:046f610bea]<style type="text/css">
a.colorchange {color: #ffffff;}
a.colorchange:hover {color: #333333;}
</style>[/code:1:046f610bea]

Make sense?

This is the only way I know how to do it as I don't know dreamweaver, I only know html.

raciviusdawn · 08-24-2004, 02:17 PM

Quote:

Originally Posted by roach

Jazzee,

Cheers for the help, but pardon my complete ignorance, Is it simply a case of pasting that code into my script?? I'm using Dreamweaver MX...

Jazzee is the bomb

with html..seriously...anyway, if you're using Dream MX just stay in the Design view and change your CSS instead by click the little + in the upper right hand corner where you create stylesheets...

This lets you assign link colors etc etc throughout your entire site or simply on one particular document...it does the same thing as J suggested but it does the code for you...since you have MX, you're probably used to the easy way as I am

Jazzee · 08-24-2004, 02:20 PM

Thanks, raciviusdawn

I'm clueless with WYSIWYG editors.

Fusion · 08-24-2004, 03:49 PM

Queen of html and css.

Jazzee · 08-24-2004, 03:51 PM

That's right

lol

thebassman · 08-24-2004, 05:41 PM

Worship the Queen... she has helped all of us with code several times each, I'm sure... LOL

priyanka · 08-26-2004, 11:05 PM

Hi,
If you use Microsoft Front page, it will take you hardly 2 minutes to do that. what you need to do is go to "Insert" option, click on "Web components" and I think the first option there contains HOVER BUTTON. You only need to set its properties and your work is done.

Jazzee · 08-27-2004, 08:05 AM

They are using Dreamweaver as stated above.

**LazyJim** · 08-29-2004, 05:40 PM

OMG Frontpage insert web componant hover button - doesn't that add applets istead of links??? AAAAAARRRGH!!!

Jazzee · 08-29-2004, 05:43 PM

Eww. Applets.