Hide / show content via CSS:hover (or JS if need be)

Posted by Chris on Stack Overflow See other posts from Stack Overflow or by Chris
Published on 2010-05-11T08:52:25Z Indexed on 2010/05/11 9:04 UTC
Read the original article Hit count: 102

Filed under:
|
|
|
|

I have the following html:

<li>
<span class="one">Stuff here</span>
<span class="two">More stuff</span>
</li>

.one { display: block; }
.two { display: none; }

What is the easiest method, preferably CSS only, to hide one and show two when the mouse rolls over the <li> container.

If this cannot be done via CSS and only Javascript, I would prefer jQuery via something like live() as the content is updated live and do not wish to constantly rebind manually.

EDIT: I forgot to mention that this has to work in IE6 :/

© Stack Overflow or respective owner

Related posts about css

Related posts about html