How to show/hide classes using CSS and or javascript?

quushich

I want to be able to stop a paragraph mid-sentence and provide a 'more' link that then disappears when clicked and the rest of the paragraph appears in place. Much like many blogs and social sites do.

Below is code from just such a site... so what is needed to make it work?

Expand|Select|Wrap|Line Numbers

 
<div id="story" class="text_exposed_root">Yay for being around yada
 
<span class="text_exposed_hide">...</span>
 
<span class="text_exposed_show"> yada on Sunday!</span>
 
<span class="text_exposed_hide">

<span class="text_exposed_link">

<a onclick="CSS.addClass($("story"), "text_exposed");">read more</a>

</span>

</span>

</div>

Thanks for any help.

drhowarddrfine

Obviously, with the 'onclick' attribute, you need javascript and you should ask this question on that board.

Actually, something can be done without js by assigning CSS to the anchor's ':visited' property but that can be unreliable and only works on one click.

How to show/hide classes using CSS and or javascript?

re: How to show/hide classes using CSS and or javascript?

Similar HTML / CSS bytes

/bytes/development

/bytes/it

/bytes/about