I'm posting the entire script so you can get a better idea of how it works.
<!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>
<title>demo</title>
<link rel="stylesheet" type="text/css" href="http://mysite.com/NAMI/model/sb/shadowbox.css">
<script type="text/javascript" src="http://mysite.com/NAMI/model/sb/shadowbox.js"></script>
<script type="text/javascript" src="shadowbox/shadowbox.js"></script>
<style type="text/css">
.app23{
width:430px;
display: block;
margin:40px auto;
background-image:url('http://www.mysite.com/images/bg.jpg');
font-size:24px;
font-family:Verdana;
text-align:left;
padding-top:10px;
}
#calc22{
font-weight:bold;
width:380px;
margin:0px auto;
padding: 0px; 0px; 0px; 20px;
font-size:16px;
font-family:Verdana;
}
#total{
text-align:center;
font-size: 18px;
font-weight: bold;
padding: 10px;
}
#contactus{
display:block;
clear:both;
}
.disclaim{
font-size:12px;
font-family: Verdana;
text-align:center;
clear:none;
padding:5px;
}
</style>
<script type="text/javascript">
function calc_price()
{
var price = document.getElementById('price');
var cust = document.getElementById('cust');
var seo44 = document.getElementById('seo44');
var month = document.getElementById('month');
var custVal = (cust.checked == true) ? parseInt(cust.value) : 0;
var seo44Val = (seo44.checked == true) ? parseInt(seo44.value) : 0;
var multiply = (seo44.checked == true) ? parseInt(month.value) : 1;
var total = (parseInt(price.value)+custVal+(multiply*seo44Val));
var shadowBoxlink = '<a href="http://www.mysite.com/form/htmlform.html" onClick="shad();iframe; return false;"><center>Contact Us</center></a>';
document.getElementById('total').innerHTML = '$ '+total+shadowBoxlink;
return false;
}
Shadowbox.init({
});
function shad() {
Shadowbox.open({
player: "iframe",
title: "Contact Us",
height: 620,
width: 450
});
};
</script>
</head >
<body>
<div class="app23">
<center>Web Design Cost Estimate</center><br />
<form name="calc" id="calc22">
<b>Enter the Number of Pages:</b><br /> <select id="price" name="price" onChange="javascript:calc_price();">
<option value="100.00">1 Pages</option>
<option value="200.00">2 Pages</option>
<option value="300.00">3 Pages</option>
<option value="400.00">4 Pages</option>
<option value="500.00">5 Pages</option>
</select><br />
<br />
<input type="checkbox" name="cust" id="cust" value="80" onChange="javascript:calc_price();" />Custom Header<br />
<br />
<input type="checkbox" name="seo44" id="seo44" value="110" onChange="javascript:calc_price();" /> SEO (Search Engine Optimization) <br />
<select id="month" name="month" onChange="javascript:calc_price();">
<option value="1">1 month</option>
<option value="2">2 months</option>
<option value="3">3 months</option>
<option value="4">4 months</option>
<option value="5">5 months</option>
<option value="6">6 months</option>
<option value="7">7 months</option>
<option value="8">8 months</option>
<option value="9">9 months</option>
<option value="10">10 months</option>
<option value="11">11 months</option>
<option value="12">12 months</option>
</select>
<div id="total"> </div>
</form>
<div class="disclaim">*Rates may vary depending on customization and discounts.</div>
</div>
</body>
</html>