Thanks, that doesn't quite help me. I'm a noob.
I did find this . . . which I can modify to work for me.
Code:
<html>
<head>
<title>RB Tabs</title>
<style type="text/CSS">
div.RBtnTab { display:none; height:100px; width:200px; background-color:yellow}
</style>
<script type="text/javascript">
// getElementByClass function from http://www.webmasterworld.com/forum91/1729.htm
//Create an array
var allPageTags = new Array();
function doSomethingWithClasses(theClass) {
//Populate the array with all the page tags
var allPageTags=document.getElementsByTagName("*");
//Cycle through the tags using a for loop
for (var i=0; i<allPageTags.length; i++) {
//Pick out the tags with our class name
if (allPageTags[i].className==theClass) {
//Manipulate this in whatever way you want
allPageTags[i].style.display='none';
}
}
}
function Show(ids) {
doSomethingWithClasses('RBtnTab');
var obj = document.getElementById(ids);
if (obj.style.display != 'block') { obj.style.display = 'block'; }
else { obj.style.display = 'none'; }
}
</script>
</head>
<body>
<label for="lDIV1">
<input id="lDIV1" type="radio" name='rbtab' value='DIV1' onClick="Show('DIV1')">Event Info</label>
<label for="lDIV2">
<input id="lDIV2" type="radio" name='rbtab' value='DIV2' onClick="Show('DIV2')">Plan Event</label>
<label for="lDIV3">
<input id="lDIV3" type="radio" name='rbtab' value='DIV3' onClick="Show('DIV3')">Contact Us</label>
<div id='Content' style="display:block"><br />
<div id='DIV1' class="RBtnTab">Event Information</div>
<div id='DIV2' class="RBtnTab">Plan Event Information</div>
<div id='DIV3' class="RBtnTab">Contact us at: xxx</div>
</div>
</body>
</html>
Junior Coders
Show/Hide with Radio Buttons in a form.
Posting Permissions
Reply With Quote
Bookmarks