Tek-Tips is the largest IT community on the Internet today!

Members share and learn making Tek-Tips Forums the best source of peer-reviewed technical information on the Internet!

  • Congratulations SkipVought on being selected by the Tek-Tips community for having the most helpful posts in the forums last week. Way to Go!

style and text color failure

Status
Not open for further replies.

Deltaflyer

Programmer
Oct 11, 2000
184
0
0
GB
i am currently using

function mousein(x)
{
x.style.color = '#000000'
x.style.textDecoration = 'none'
}
function mouseout(x)
{
x.style.color = '#FFFFFF'
x.style.textDecoration = 'underline'
}



To change the style of my hyperlinks when the mouse is hovered over them,

<a href=blah.com onmouseover=javascript:mousein(this) onmouseout=javascript:mouseout(this)>blah.com</a>

at the moment the only result i get is the underline vanishes and replaces when the mouse is moved away, i have to accomodate IE6 AND NS4+, any help would be greatly appreciated. DeltaFlyer
The Only Programmer To Crash With Style. LOL
 
You are trying to do easy things complicated.

Two lines of simple CSS will solve the problem without any javascript at all, and it will work in all browsers: IE, NN4.x (without hover effect), Opera, N6.

Also, obj.style will never work in NN4.x (don't know about N6).
 
I have tried that but to no avail, that is why i reverted to JS.

Could you show me how to do this as i am not at all familiar with CSS? DeltaFlyer
The Only Programmer To Crash With Style. LOL
 
ok, I should have told this before.

CSS is very easy and powerful, spend some time to learn it and you'll enjoy it!
This is, for example, taken from the source of the forum's page (Tek-Tips ©):

<style>
a {color: #003399}

a:visited {color: #003399}

a:active {color: #3366cc}

a:hover {color: red; text-decoration: none;}

</style>

Using this technique you'll be able to set/change text attibutes, such as:
text-decoration: none | underline | overline, etc.;
font-weight: normal | bold, etc.;
also borders, margins, paddings, position and lot of others, too many to mention them all here.

As for me, one of the best CSS &quot;quick&quot; references in on GevGuru: this is the one I use for a long time.
Also don't forget to test what you do in different browsers, because they interpret CSS differently, but it's also possible to make it work (and look) the same in all of them.

good luck
 
Status
Not open for further replies.

Part and Inventory Search

Sponsor

Back
Top