Re: text rollover query

by "Kehvan M. Zydhek" <kehvan(at)zydhek.net>

 Date:  Fri, 18 Jan 2002 12:46:47 -0800
 To:  <hwg-style(at)hwg.org>,
"Marsha Graham" <mgraham(at)mva.net>
 References:  mva
  todo: View Thread, Original
Marsha,

What you describe SHOULD work, just make sure your a: classes are in the
following order ALWAYS ALWAYS ALWAYS:

1 -> a:link
2 -> a:visited
3 -> a:hover
4 -> a:active

If your class declarations are in some other order, that would likely
explain why the hover isn't working.

I checked your site (online) and found three things of interest:
#1: your external style sheet has <STYLE></STYLE> tags in it, which it
shouldn't.
#2: your a:hover class does not have the font-enlarging code you describe in
your email.
#3: after downloading your code so I could edit and test for myself, I added
your font-enlarging code and rearranging the a: classes as described above,
and the enlargement does work, but not on your white links, because those
links have an overriding class of ".seventh" which has the font set to
"xx-small". If you want .seventh to be a linking class, you should add
additional code to your style sheet for it:

.seventh:link
.seventh:visited
.seventh:hover
.seventh:active

This should be done for any class you have overriding the default linking
classes.

Good luck,
Kehvan

:::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::
:: NORTON ANTI-VIRUS 2002 scanned this email prior to sending. It is free
:: of any known embedded or attached viruses, trojans, or internet worms.
:::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::


----- Original Message -----
From: "Marsha Graham" <mgraham(at)mva.net>
To: <hwg-style(at)hwg.org>
Sent: Friday, January 18, 2002 11:35
Subject: text rollover query


> Hello all,
>
> I am rebuilding a site I first coded in 1997 in 3.2.  The site's a mess
> after all these years and methods of going at it - from hancoding to
> WYSIWYG and back.   I'm stripping out all the old code and using a style
> sheet and ssi driven menus for the navigation bars.
>
> I thought I was on the home stretch with the rebuild until I realized
> atomz.com doesn't search the ugly as sin but utilitarian drop down boxes
on
> several major pages of the site.  The corrective action I'm considering is
> expanding the navigation as opposed to having visitors drill 4 levels down
> for information.
>
> What I have been trying to locate is the way to do a rollover on a link
> using the a:hover command so that the small text becomes larger as I'm
> shrinking text sizes to keep the nav bar from being 2 screens long.
>
> I have tried
>
> a:hover {text-decoration: none; background: #EEB422; font-size: large}
>
> but it doesn't seem to get a response.
>
> The test page is at: http://pagan-home.com/Sept2001/index2.html
>
> I've tried to find answers through webmonkey.com and wvdl.com as well as
in
> my DHTML book by O'Reilly and the CSS book by Lie and Bos.  I'm beginning
> to think my mind is fried because it has got to be somewhere I have
already
> looked and I've just missed the extremely simple answer.
>
> Thanks in advance for any ideas you may have, including alternatives to
> such a long navigation list, url's to resources, etc.   I have tried other
> methods before but the right side method seems to be the cleanest for the
> blind plus provide a "you can go anywhere from here" aspect to the site.
> I'd rather not have visitors drilling down four levels to find information
> if I can help it.
>
> Regards,
> Marsha Graham
>
>
>

HWG hwg-style mailing list archives, maintained by Webmasters @ IWA