dannyboy83
03-17-2009, 04:13 PM
1) Script Title: Animated Collapsible Div
2) Script URL (on DD): http://www.dynamicdrive.com/dynamicindex17/animatedcollapse.htm
3) Describe problem: I would like to change the "changing image toggle button" to text.
The code below:
animatedcollapse.ontoggle=function($, divobj, state){
if (divobj.id=="peter" || divobj.id=="sarah") //only react to these two collapsible DIVs
document.getElementById(divobj.id+"-toggle").src=(state=="block")? "collapse.jpg" : "expand.jpg"
}
Basically states that the image SRC changes onclick.
Instead, I have text rather than an image that I'd like to change on click.
So for example, if I have the word "expand". Can it change to "collapse" onclick?
My HTML code:
<div class="CommonContentBox Highlighted2" style="padding-bottom:10px;">
<div style="height:10px;margin-bottom:20px;"><h4 id="forumposts-toggle" class="CommonContentBoxHeader"><a href="javascript:void(0)" onclick="javascript:animatedcollapse.toggle('forumposts')">► Latest forum posts</a></h4></div>
Is there a way to use JavaScript to change the text between the h4 tags?
Something like H4.text ?
2) Script URL (on DD): http://www.dynamicdrive.com/dynamicindex17/animatedcollapse.htm
3) Describe problem: I would like to change the "changing image toggle button" to text.
The code below:
animatedcollapse.ontoggle=function($, divobj, state){
if (divobj.id=="peter" || divobj.id=="sarah") //only react to these two collapsible DIVs
document.getElementById(divobj.id+"-toggle").src=(state=="block")? "collapse.jpg" : "expand.jpg"
}
Basically states that the image SRC changes onclick.
Instead, I have text rather than an image that I'd like to change on click.
So for example, if I have the word "expand". Can it change to "collapse" onclick?
My HTML code:
<div class="CommonContentBox Highlighted2" style="padding-bottom:10px;">
<div style="height:10px;margin-bottom:20px;"><h4 id="forumposts-toggle" class="CommonContentBoxHeader"><a href="javascript:void(0)" onclick="javascript:animatedcollapse.toggle('forumposts')">► Latest forum posts</a></h4></div>
Is there a way to use JavaScript to change the text between the h4 tags?
Something like H4.text ?