HighDots Forums  

Can I use a style to only a selection of <a>-hovers not the hole page?

Cascading Style Sheets Layout/presentation on the WWW (comp.infosystems.www.authoring.stylesheets)


Discuss Can I use a style to only a selection of <a>-hovers not the hole page? in the Cascading Style Sheets forum.



Reply
 
Thread Tools Display Modes
  #1  
Old   
Michel
 
Posts: n/a

Default Can I use a style to only a selection of <a>-hovers not the hole page? - 07-07-2004 , 11:51 AM






I like to have a small menu where the <a> items have a blue background
on hover like normal window-menu's.
Like this:
<tr onmouseover="style.background='#0000ff';"
onmouseout="style.background='#ffffff';">
<td><a>Menu item 1</a></td>
</tr>

But I don't like to repeat the onmouse...
Is there no way to use a stylesheet where only a selection of cells or
links have this kind of blue background?

Reply With Quote
  #2  
Old   
David Dorward
 
Posts: n/a

Default Re: Can I use a style to only a selection of <a>-hovers not the hole page? - 07-07-2004 , 12:07 PM






Michel wrote:

Quote:
I like to have a small menu where the <a> items have a blue background
on hover like normal window-menu's.
http://css.maxdesign.com.au/listamatic/

--
David Dorward <http://blog.dorward.me.uk/> <http://dorward.me.uk/>
Home is where the ~/.bashrc is


Reply With Quote
  #3  
Old   
Mark Tranchant
 
Posts: n/a

Default Re: Can I use a style to only a selection of <a>-hovers not the holepage? - 07-08-2004 , 01:07 AM



Michel wrote:

Quote:
I like to have a small menu where the <a> items have a blue background
on hover like normal window-menu's.
Like this:
tr onmouseover="style.background='#0000ff';"
onmouseout="style.background='#ffffff';"
td><a>Menu item 1</a></td
/tr

But I don't like to repeat the onmouse...
Is there no way to use a stylesheet where only a selection of cells or
links have this kind of blue background?
Yes:

1) Enclose the menu items in a <div> with id or class and use CSS selectors

<div id="menu">
<a ...>blah</a>
</div>

#menu a:hover {...}

2) Apply a class to each <a> element.

<a class="menu" ...>blah</a>

a.menu:hover {...}

Hope that helps. See my site for an example - note how the header, menu
and content links behave differently; and how the internal and external
content links are also different.

--
Mark.
http://tranchant.plus.com/


Reply With Quote
Reply




Thread Tools
Display Modes

Posting Rules
You may not post new threads
You may not post replies
You may not post attachments
You may not edit your posts

vB code is On
Smilies are On
[IMG] code is On
HTML code is Off



Powered by vBulletin Version 3.5.4
Copyright ©2000 - 2008, Jelsoft Enterprises Ltd.