![[H]ard|Forum](/styles/hardforum/xenforo/logo_dark.png){kind=logo}
monkeyboys6
n00b
- Joined
- Jan 8, 2008
- Messages
- 19
ok so i am making this page and i am trying to use java script to make it so that when i have 1 box checked a certain text appears or when i have the other checked another set appears but when i switch which ones is checked they dont change. Please help!!! Thank you in advance
Heres my code :
Heres my code :
Code:
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<script type="text/javascript">
<!--
function Display() {
document.write('my day is a great day');
valid = true;
if ( document.Theform.corsair.checked == false )
{
document.write('today is a great day');
valid = false;
}
return valid;
}
//-->
</script>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>K & B Tech Appointments</title>
<style type="text/css">
<!--
body {
font: 100% Verdana, Arial, Helvetica, sans-serif;
background: #666666;
margin: 0; /* it's good practice to zero the margin and padding of the body element to account for differing browser defaults */
padding: 0;
text-align: center; /* this centers the container in IE 5* browsers. The text is then set to the left aligned default in the #container selector */
color: #000000;
background-image: url(Images/Backgrounds/background2a.png);
background-position:center;
background-color: #000000;
background-repeat: repeat-y;
}
.twoColFixLtHdr #container {
width: 780px;
margin: 0 auto; /* the auto margins (in conjunction with a width) center the page */
border: 1px solid #000000;
text-align: left; /* this overrides the text-align: center on the body element. */
background-color: #000000;
background-repeat: repeat;
background-image: url(Images/Backgrounds/header%20background1.png);
}
.twoColFixLtHdr #header {
}
.twoColFixLtHdr #header h1 {
margin: 0; /* zeroing the margin of the last element in the #header div will avoid margin collapse - an unexplainable space between divs. If the div has a border around it, this is not necessary as that also avoids the margin collapse */
padding: 10px 0; /* using padding instead of margin will allow you to keep the element away from the edges of the div */
}
.twoColFixLtHdr #sidebar1 {
float: left; /* since this element is floated, a width must be given */
width: 200px; /* the background color will be displayed for the length of the content in the column, but no further */
padding: 15px 10px 15px 20px;
}
.twoColFixLtHdr #mainContent {
background-repeat: no-repeat;
margin-top: 0;
margin-bottom: 0;
padding-top: 0;
padding-right: 20px;
padding-bottom: 0;
padding-left: 20px;
}
.twoColFixLtHdr #footer {
padding: 0 10px 0 20px;
}
.twoColFixLtHdr #footer p {
margin: 0; /* zeroing the margins of the first element in the footer will avoid the possibility of margin collapse - a space between divs */
padding: 10px 0; /* padding on this element will create space, just as the the margin would have, without the margin collapse issue */
}
.fltrt { /* this class can be used to float an element right in your page. The floated element must precede the element it should be next to on the page. */
float: right;
margin-left: 8px;
}
.fltlft { /* this class can be used to float an element left in your page */
float: left;
margin-right: 8px;
}
.clearfloat { /* this class should be placed on a div or break element and should be the final element before the close of a container that should fully contain a float */
clear:both;
height:0;
font-size: 1px;
line-height: 0px;
}
body,td,th {
color: #FFFFFF;
height: 55px;
}
.style1 {
color: #FFFFFF;
top: auto;
}
.style2 {color: #FFFFFF}
-->
</style>
<!--[if IE 5]>
<style type="text/css">
/* place css box model fixes for IE 5* in this conditional comment */
.twoColFixLtHdr #sidebar1 { width: 230px; }
</style>
<![endif]--><!--[if IE]>
<style type="text/css">
/* place css fixes for all versions of IE in this conditional comment */
.twoColFixLtHdr #sidebar1 { padding-top: 30px; }
.twoColFixLtHdr #mainContent { zoom: 1; }
/* the above proprietary zoom property gives IE the hasLayout it needs to avoid several bugs */
</style>
<![endif]-->
<script src="Scripts/AC_RunActiveContent.js" type="text/javascript"></script>
</head>
<body class="twoColFixLtHdr">
<div id="container">
<div id="header">
<script type="text/javascript">
AC_FL_RunContent( 'codebase','http://download.macromedia.com/pub/shockwave/cabs/flash/swflash.cab#version=9,0,28,0','width','780','height','280','title','K & B Tech','src','header and navi bar2','quality','high','pluginspage','http://www.adobe.com/shockwave/download/download.cgi?P1_Prod_Version=ShockwaveFlash' ); //end AC code
</script><noscript><object classid="clsid:D27CDB6E-AE6D-11cf-96B8-444553540000" codebase="http://download.macromedia.com/pub/shockwave/cabs/flash/swflash.cab#version=9,0,28,0" width="780" height="280" title="K & B Tech">
<param name="quality" value="high" /><param name="SRC" value="header and navi bar2.swf" />
<embed src="header and navi bar2.swf" width="780" height="280" quality="high" pluginspage="http://www.adobe.com/shockwave/download/download.cgi?P1_Prod_Version=ShockwaveFlash" type="application/x-shockwave-flash"></embed>
</object>
</noscript></div>
<div id="mainContent">
<p>Please note that all of these parts for this computer and specialy selected for ultimum performance and userability. As a result of this there are not as many options because the parts are chosen to work best together.<br />
*If you would like a special part or work done please email us/Contact us, BEFORE purchasing!</p>
<table width="688" border="0">
<tr>
<td width="193"><p>Power supply</p>
<form id="Theform" name="Theform" method="post" action="">
<table width="142" border="0">
<tr>
<td width="20"><label>
<input type="checkbox" name="corsair1" id="corsair1" checked="checked" />
</label></td>
<td width="112" height="50">Corsair 850W $ 139.99</td>
</tr>
<tr>
<td><label>
<input type="checkbox" name="corsair2" id="corsair2" />
</label></td>
<td>Corsair 950W $159.99</td>
</tr>
</table>
</form>
<p> </p></td>
<td width="352"><script type="text/javascript">
<!--
Display();
//-->
</script></td>
<td width="129"><img name="PowerSupply" src="" width="117" height="116" alt="" /> </td>
</tr>
<tr>
<td>Motherboard</td>
<td> </td>
<td> </td>
</tr>
<tr>
<td>Processor</td>
<td> </td>
<td> </td>
</tr>
<tr>
<td>Ram</td>
<td> </td>
<td> </td>
</tr>
<tr>
<td>Hard drive</td>
<td> </td>
<td> </td>
</tr>
<tr>
<td>Video card </td>
<td> </td>
<td> </td>
</tr>
<tr>
<td>Keyboard</td>
<td> </td>
<td> </td>
</tr>
<tr>
<td>Mouse</td>
<td> </td>
<td> </td>
</tr>
<tr>
<td>Screen</td>
<td> </td>
<td> </td>
</tr>
<tr>
<td>Water Cooling</td>
<td> </td>
<td> </td>
</tr>
<tr>
<td>Case</td>
<td> </td>
<td> </td>
</tr>
<tr>
<td> </td>
<td> </td>
<td> </td>
</tr>
<tr>
<td> </td>
<td> </td>
<td> </td>
</tr>
<tr>
<td> </td>
<td> </td>
<td> </td>
</tr>
</table>
<p> </p>
<p align="center" class="style1"><br class="clearfloat" />
</p>
</div>
<div id="footer">
<p> </p>
<p align="center" class="style2">©K & B Tech</p>
<!-- end #footer --></div>
<!-- end #container --></div>
</body>
</html>
Last edited:
