CSS Mouseover Question

R

Roy Schestowitz

Toronto said:
Hi

How do you do a Mouse Over in CSS

thanks,


Robert

Here is an example:

CSS:

..mouseOn{
border-top: 3px solid #525252;
border-bottom: 7px solid #525252;
border-left: 5px solid #525252;
border-right: 3px solid #525252;
}

Hyper-text:

<X class ="Default"
onmouseover =" this.className='mouseOn" />
 
R

rf

<X class ="Default"
onmouseover =" this.className='mouseOn" />

I think the OP means without javascript.

a:link {...}
a:visited {extra properties for visited links}
a:hover {extra properties for hovered links}
a:active {extra properties for the active link}
 
R

Roy Schestowitz

rf said:
I think the OP means without javascript.

a:link {...}
a:visited {extra properties for visited links}
a:hover {extra properties for hovered links}
a:active {extra properties for the active link}

That's correct, but there was no mentioning of link elements in the
question.

By the way, there was a missing apostrophe in that code I typed down. Didn't
think it was worth superseding the article for...
 
N

Neal

Toronto Newf said:
Hi

How do you do a Mouse Over in CSS

unless you plan to accomodate IE, do this:

selector:hover {
property: value;
}

If you plan to accomodate IE, lotsa luck. You can use conditionals or
hacks to send special things to IE.
 
L

Leif K-Brooks

Roy said:
rf wrote:




That's correct, but there was no mentioning of link elements in the
question.

So then use a different selector:

p:hover {
color: red
}
 
R

Roy Schestowitz

SpaceGirl said:
IE only support :hover on links. You cannot use it on any other elements.

Indeed. I was surprised when you suggested that statement which appears a
little too sophisticated for IE to support.
 
L

Leif K-Brooks

SpaceGirl said:
IE only support :hover on links. You cannot use it on any other elements.

And Lynx doesn't support CSS in the slightest, but no one complains
about Web pages not being quite as pretty when viewed with it. As long
as the page remains usable and non-ugly, why worry if it's not quite as
pretty as it should be in grossly inferior Web browsers?
 
S

SpaceGirl

Leif said:
And Lynx doesn't support CSS in the slightest, but no one complains
about Web pages not being quite as pretty when viewed with it. As long
as the page remains usable and non-ugly, why worry if it's not quite as
pretty as it should be in grossly inferior Web browsers?

Well teh functionality is lost completely. Careful design could get it
to fail safe in IE... but really... it doesn't.

--


x theSpaceGirl (miranda)

# lead designer @ http://www.dhnewmedia.com #
# remove NO SPAM to email, or use form on website #
 
R

rf

Roy Schestowitz said:
SpaceGirl wrote: elements.

Indeed. I was surprised when you suggested that statement which appears a
little too sophisticated for IE to support.

It was I that suggested hover, not the SpaceGirl.

I suggested that approach because of the nature of the question.

Such a question would seem to imply that the OP has noticed that certain
WISIGYDG "editors" use loads of javascript to achieve a hover effect on
generated anchor elements (called a "mouseover" only because that is the
event handler that is used)

Further, the OP has probably just discovered CSS and is wondering if it can
be used to achieve the same effect, without all the nasty javascript.

I seriously doubt that the OP wants to change the colours of hovered
paragraphs but rather wants to do something with the colour of a link, just
like most modern sites do.

As to IE support of the lack thereof, if the OP was aware that modern
browsers support the :hover pseudo class on elements other than anchor
elements, and that IE does not, then the OP would already know the answer to
the question.

Anyway, :hover *is* usually used only with links. To use it with other
elements (by changing the colour of a paragraph, say) one may just confuse
to the viewer, making said viewer think that the text *is* a link and should
be clicked on.
 
M

Michael Winter

[Image swaps]
all the nasty javascript.

It's a little unfair to poor old Javascript to generalise like that. Yes,
there certainly are many poor implementations that are hard to maintain,
but it doesn't have to be that way.

[snip]

Mike
 
R

rf

Michael Winter said:
[Image swaps]
all the nasty javascript.

It's a little unfair to poor old Javascript to generalise like that. Yes,
there certainly are many poor implementations that are hard to maintain,
but it doesn't have to be that way.

<grin/>

I was not really talking about a particular implementation of javascript,
but rather the nasty stuff that the so called editors spit out to achieve a
:hover effect, dreamweaver being the chief offender :)

So much javascript when a couple of CSS rules will do the same thing, and
encourage better coding and design practices as well, like swapping
background images rather than swapping pretty foreground images containing
pictures of text.
 

Ask a Question

Want to reply to this thread or ask your own question?

You'll need to choose a username for the site, which only take a couple of moments. After that, you can post your question and our members will help you out.

Ask a Question

Similar Threads


Members online

Forum statistics

Threads
473,744
Messages
2,569,483
Members
44,901
Latest member
Noble71S45

Latest Threads

Top