/    Sign up×
Community /Pin to ProfileBookmark

[RESOLVED] Control visibility of different div’s with one link

Copy linkTweet thisAlerts:
Apr 29.2009

Hello gang, I have div that contains a button and I have another div that contains some additional form content. From one link, I would like to control the visibilty of both div’s. When the page loads, the div with the button will be visible, when the link is clicked, I want to hide the button and show the form content. If the link is clicked again the button will be shown and the form content will be hidden. I have found numerous examples but none that will work for me in this case. Any help would be appreciated. Thanks in advance.

to post a comment
JavaScript

2 Comments(s) ↴

Copy linkTweet thisAlerts:
@FangApr 29.2009 — <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN" "http://www.w3.org/TR/html4/strict.dtd">
<html lang="en">
<head>
<title></title>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8">

<script type="text/javascript">
function toggle() {
var content=document.getElementById('content');
var control=document.getElementById('control');
if(content.style.display=='none') {
content.style.display='';
control.style.display='none';
}
else {
content.style.display='none';
control.style.display='';
}
}
</script>

<style type="text/css">
* {margin:0;padding:0;}
</style>

</head>
<body>
<form action="#" name="form2">
<div>
<div id="content" style="display:none;">
<label>content<input type="text" name="content"></label>
</div>
<div id="control">
<button type="button" value="control">control</button>
</div>
<a href="#" onclick="toggle(); return false;">toggle</a>
</div>
</form>
</body>
</html>
Copy linkTweet thisAlerts:
@dkirkauthorApr 29.2009 — thanks, absolutley perferct. I ended up solving things server side but this is simple and clean. thanks again.
×

Success!

Help @dkirk 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.18,
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: @AriseFacilitySolutions09,
tipped: article
amount: 1000 SATS,

tipper: @Yussuf4331,
tipped: article
amount: 1000 SATS,

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