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!

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

mouse over change color?

Status
Not open for further replies.
juandiegomc

juandiegomc

Programmer
Apr 25, 2003
60
US
hello,

I need the snippet of code to change the color from "blue"

to change to red on "mouse over" or "mouse touch", as it

does here on the TEK-TIP labels.

on a command word to open a new page?

juandiegomcc@afirmacion.com
 
Sort by date Sort by votes
What you need is CSS pseudo classes. In IE they only work on links (the <a> tag) but it seems you are looking for that. Here's how you do it:

<style>
a:link, a:visited { color: blue; }
a:hover { color: red; }
</style>

<a href=&quot;uri.html&quot; target=&quot;_blank&quot;>Open in new windows</a>

The problem with this is that all your links will follow this behaviour. So you can define a special class and apply it only to those you want:

<style>
a.classname:link, a.classname:visited { color: blue; }
a.classname:hover { color: red; }
</style>

<a href=&quot;uri.html&quot; target=&quot;_blank&quot; class=&quot;classname&quot;>Open in new windows</a>
 
Upvote 0 Downvote
Thanks Vragabond,

Where should one store this &quot;class&quot;? I am just catching on the CSS.

juan diego mcc

juandiegomcc@afirmacion.com
 
Upvote 0 Downvote
This code should do the job for you:

Code: 
<HTML>
<HEAD>
<STYLE TYPE=&quot;text/css&quot;>
a:link		{ color: blue; }
a:visited	{ color: blue; }
a:hover 	{ color: red; }
</STYLE>
</HEAD>
<BODY>

<A HREF=&quot;[URL unfurl="true"]http://www.google.co.uk/&quot;>Click[/URL] here</A> to visit Google UK...
</BODY>
</HTML>

Hope this helps!

Dan
 
Upvote 0 Downvote
Happy New Year BillyRayPreachersSon,

I was only able to get one label to respond to the code and it comes out the wrong color, green since I made green the color of a label 'visited' Could you look at my web site:


and go to the spanish --->>> and then to links.... and you will see the labels .

juandiegomcc@afirmacion.com
 
Upvote 0 Downvote
Hmmm, I did what you asked but there was no css code there. Incidentaly, your buttons do not work in Mozilla 1.4 (as well as browsers which have javascript disabled) - I had to reach the page by manually typing URLs.
 
Upvote 0 Downvote
Status
Not open for further replies.

Similar threads

scorney
  • Locked
  • Question
background image with overlay which Hover when over a specific Area/Form
Replies
1
Views
1K
3esolar
3
craigward
  • Locked
  • Question
Change IIS7 Default landing page
Replies
1
Views
232
feherke
feherke
notsoevilgenius
  • Locked
  • Question
Change CSS for Mobile Portrait
Replies
2
Views
227
notsoevilgenius
notsoevilgenius
garcosta
  • Locked
  • Question
CSS Coding for Gradient Color Background for all Platforms
Replies
3
Views
276
1DMF
1DMF
ggriffit
  • Locked
  • Question
Adding a CSS attribute overlay using ::after 1
Replies
8
Views
416
ChrisHirst
ChrisHirst

Part and Inventory Search

Sponsor

Back
Top