How do I swap triangle icons when doing expanding/collapsing divs with Javascript/CSS

Posted by SL on Stack Overflow See other posts from Stack Overflow or by SL
Published on 2010-02-28T18:48:54Z Indexed on 2010/06/08 19:22 UTC
Read the original article Hit count: 138

Filed under:
|
|
|

I have a div that I want to toggle between displaying or not when a user clicks on a piece of text. I have a javascript function that toggles a div on or off. That works fine. What I don't know how to do is to have a triangle that points to the right or down depending on whether the div is open.

My HTML looks like this:

<a onclick="toggleDiv('myDiv');">Click here to expand or close div</a>
<div id="myDiv" style="display:none">
   ...
</div>

How do I add one of those triangles and have it point the right way, ideally with just HTML, Javascript, and CSS? The triangle would appear to the left of the "Click here..." string.

Thanks.

© Stack Overflow or respective owner

Related posts about JavaScript

Related posts about html