/    Sign up×
Community /Pin to ProfileBookmark

javascript div collapse problem

Copy linkTweet thisAlerts:
May 17.2010

<scrapped>

Found soln myself

to post a comment
JavaScript

3 Comments(s) ↴

Copy linkTweet thisAlerts:
@tirnaMay 17.2010 — Try this:

[code=php]
<html>
<head>
<style type="text/css">
.expCollapse {

width:200px;
height:100px;
border:1px solid #ccc;
}

</style>
<script type="text/javascript">
function toggle(imgO,obj) {
var elem=document.getElementById(obj);

if (imgO.alt=='plus') {
elem.style.display='block';
imgO.alt='minus';

}
else {
elem.style.display='none';
imgO.alt='plus';
}
imgO.src=imgO.alt+'.gif';
}
</script>
</head>
<body>
<div>
<img src="plus.gif" alt="plus" onClick="toggle(this,'expCollapseAsia')">ASIA
<div id="expCollapseAsia" class="expCollapse" style="display:none">ABC
</div>
</div>
<div>
<img src="plus.gif" alt="plus" onClick="toggle(this,'expCollapseAmerica')">AMERICA
<div id="expCollapseAmerica" class="expCollapse" style="display:none">DEF
</div>
</div>
</body>
</html>
[/code]
Copy linkTweet thisAlerts:
@cofactorauthorMay 17.2010 — Try this:

[code=php]
<html>
<head>
<style type="text/css">
.expCollapse {

width:200px;
height:100px;
border:1px solid #ccc;
}

</style>
<script type="text/javascript">
function toggle(imgO,obj) {
var elem=document.getElementById(obj);

if (imgO.alt=='plus') {
elem.style.display='block';
imgO.alt='minus';

}
else {
elem.style.display='none';
imgO.alt='plus';
}
imgO.src=imgO.alt+'.gif';
}
</script>
</head>
<body>
<div>
<img src="plus.gif" alt="plus" onClick="toggle(this,'expCollapseAsia')">ASIA
<div id="expCollapseAsia" class="expCollapse" style="display:none">ABC
</div>
</div>
<div>
<img src="plus.gif" alt="plus" onClick="toggle(this,'expCollapseAmerica')">AMERICA
<div id="expCollapseAmerica" class="expCollapse" style="display:none">DEF
</div>
</div>
</body>
</html>
[/code][/QUOTE]

you are pretty fast.

yup...exactly I did that way ?

Thanks
Copy linkTweet thisAlerts:
@tirnaMay 17.2010 — no problem - happy to help ?
×

Success!

Help @cofactor spread the word by sharing this article on Twitter...

Tweet This
Sign in
Forgot password?
Sign in with TwitchSign in with GithubCreate Account
about: ({
version: 0.1.9 — BETA 5.4,
whats_new: community page,
up_next: more Davinci•003 tasks,
coming_soon: events calendar,
social: @webDeveloperHQ
});

legal: ({
terms: of use,
privacy: policy
});
changelog: (
version: 0.1.9,
notes: added community page

version: 0.1.8,
notes: added Davinci•003

version: 0.1.7,
notes: upvote answers to bounties

version: 0.1.6,
notes: article editor refresh
)...
recent_tips: (
tipper: @Yussuf4331,
tipped: article
amount: 1000 SATS,

tipper: @darkwebsites540,
tipped: article
amount: 10 SATS,

tipper: @Samric24,
tipped: article
amount: 1000 SATS,
)...