Topic: Hover and links (Page 1 of 1)

I would like to keep the hover backgroung on my menu, but would like to just have the text
change color on my song titles. Is it possible
http://bennieshepherd.com/newfiles.htm

I'm not entirely sure I understand - you want the links in the menu to change the way they currently do, but in the list of songs, you want only the text color to change?

If so, all you need to do is set up a class.

Set the default to be however you want the majority of links on the page to behave.

Set a class of .nav for the navigation menu.

So you'd have your

a:link, a:visited, a:active {
color:yellow;
}
a:hover {
color:red;
}

a.nav:link, a.nav:visited. a.nav:active {
color:yellow;
background-color:black;
}

a.nav:hover {
color:black;
background-color:yellow;
}

the colors are just examples obviously.

then in your HTML you'd have <a class="nav" href="blah blah>



[This message has been edited by DL-44 (edited 03-19-2003).]

DL-44.. Thanks for the help. That's exactly what I wanted.
Now if I could get the hover bg to come up again in IE6 when you first move the cursor
into a menu cell. Right now you have to move the cursor over the words for a highlite. After
doing that the cells will highlite when first moving cursor into a menu cell.
Hope this made some sense.
http://bennieshepherd.com/newfiles.htm

Well, what you could do, rather than have a cell at all, is to specify the links to display *as* the cell -

set them to display:block; for starters, then specify your width, height, border, etc.


Other than that option, you could use a little javascript and throw an onMouseover in the cell.

Easier and better practice to just specify the styles for the link to display as you want.

For the record, I would mark this up as a list of links:

<ul>
<li><a href="...">...</a></li>
<li><a href="...">...</a></li>
<li><a href="...">...</a></li>
</ul>

Because, after, that's just what it is - a list of links.

Then you can position the UL on the page, and style the LI's and A's as necessary.

DL-44...
Used your code example and have changed the highlighting to text color change.

Slime...
Took your advice and used UL for the menu.

Still can't get the highlight to work when you first move your cursor into the LI.
It works fine in all the other major browsers NS 7, Opera 7, Mozilla...
IE 6 is the only one giving me problems, it use to work before I put the 2 hovers in the code...
Guess one of these days I have to make the MIDI file titles into a UL..

Thanks for all the help guys, you're great...



[This message has been edited by MIDI (edited 03-25-2003).]

Hmm, I see what you mean - though I wouldn't have noticed it if you hadn't pointed it out.

Not sure why either - I'm at work now, if I get a chance I'll look at the code when I get home and see if anything jumps out...

Bear in mind that what works best for the web is what works best. It's currently trendy to use HTML list elements for link sidebars, and sure, it's semantically correct. But if the convenience of seeing <ul> and thinking "ah, right, list" doesn't counterbalance the irritation of getting it all working correctly, then there's no pressing reason you shouldn't just use line-breaks.

Are HTML list elements the Right Thing in this case? Absolutely. But there aren't any real consequences attendant on doing the sort-of-right thing.

On the same note though, there's no reason *not* to do the right thing simply because it takes a little more understanding to make it work =)

Midi - one big question: is the styling (background-color/color, etc) being applied to the <li> or to the <a>? The <a> is what you would ideally want in this case...

DL-44

Finally got around to putting the list in the menu and the midi files.
The code for the hover effect is now working.
Thanks guys...