PeteSoft.com
Home
Products
What's New
Features
FAQs
Pricing
Latest Buzz
Free Calculators
Google Gadgets

Google
Login ID
Password
Login Page

Examples
Choose 'Subscription Popup' if you want to see scripts as you would use them in your website to run the calculators in separate popup windows. If you choose 'Subscription Embedded' you will see the scripts you would include in your website to run the calculators embedded in an existing web page you have created. Or choose 'Purchased Calculators' if you want to see the simplest scripts that will get your purchased calculators up and running on your own web page.
Choose a calculator: Show scripts for: 

The following examples show how our calculators can be customized to match your website's appearance. You can copy these scripts (shown in the shaded sections) and paste them directly into your web page and they should work. You can then make whatever changes you want to get your customized look.
 
Default Appearance     view
When you subscribe on our website you will be assigned a unique account number. Your account number will be emailed to you along with instructions for how to use the calculators you have subscribed to. Your account number is also displayed in the upper left of the web window (just above the white portion of the screen) whenever you are logged in to www.WebCalcSolutions.com.
The AcctNum parameter is used to get your company name that is displayed in the header portion of each calculator run from your website. Your account number must always be included, so this example is the minimum link you will need to include to run a calculator.
<script language="JavaScript" type="text/javascript">
<!--
//CC Minimum Payment (2006 Rules)
function CreditCardMinimumPayment()
{
  window.open('http://www.webcalcsolutions.com/Credit-Card-Calculators/Credit-Card-Minimum-Payment.asp?AcctNum=1',
    '_blank',
    'width=430,height=660,directories=0,location=0,menubar=0,resizable=1,scrollbars=1,status=0,toolbar=0');
}

-->
</script>
<a href="javascript:CreditCardMinimumPayment();">CC Minimum Payment (2006 Rules)</a><br>
<br>
<a href='http://www.webcalcsolutions.com/' style='font-size: 8pt;'>Online Calculators - Financial Calculators, Health Calculators, and Health Assessments from WebCalcSolutions.com</a><br>
Graphic     view
You can replace the default graphic shown at the top of each calculator. The HdrImg parameter points to a graphic file on your website that will be used in place of the calculator's default graphic.
<script language="JavaScript" type="text/javascript">
<!--
//CC Minimum Payment (2006 Rules)
function CreditCardMinimumPayment()
{
  window.open('http://www.webcalcsolutions.com/Credit-Card-Calculators/Credit-Card-Minimum-Payment.asp?AcctNum=1&' +
    'HdrImg=http://www.webcalcsolutions.com/Images/ExampleImage.gif',
    '_blank',
    'width=430,height=660,directories=0,location=0,menubar=0,resizable=1,scrollbars=1,status=0,toolbar=0');
}

-->
</script>
<a href="javascript:CreditCardMinimumPayment();">CC Minimum Payment (2006 Rules)</a><br>
<br>
<a href='http://www.webcalcsolutions.com/' style='font-size: 8pt;'>Online Calculators - Financial Calculators, Health Calculators, and Health Assessments from WebCalcSolutions.com</a><br>
Colors & Fonts     view
You have complete control over the calculator's colors and fonts so our calculator can fully integrate into your website's overall apearance. The CSS parameter identifies a cascading style sheet file on your website that will be used to customize the calculator's header and body colors as well as font styles, sizes and colors.
<script language="JavaScript" type="text/javascript">
<!--
//CC Minimum Payment (2006 Rules)
function CreditCardMinimumPayment()
{
  window.open('http://www.webcalcsolutions.com/Credit-Card-Calculators/Credit-Card-Minimum-Payment.asp?AcctNum=1&' +
    'HdrImg=http://www.webcalcsolutions.com/Images/ExampleImage.gif&' +
    'CSS=http://www.webcalcsolutions.com/MyStyles.css',
    '_blank',
    'width=430,height=660,directories=0,location=0,menubar=0,resizable=1,scrollbars=1,status=0,toolbar=0');
}

-->
</script>
<a href="javascript:CreditCardMinimumPayment();">CC Minimum Payment (2006 Rules)</a><br>
<br>
<a href='http://www.webcalcsolutions.com/' style='font-size: 8pt;'>Online Calculators - Financial Calculators, Health Calculators, and Health Assessments from WebCalcSolutions.com</a><br>
This example of a cascading style sheet file (.css extension) shows all the classes used by the calculator and how you can change them. Your style sheet only needs to include sections (starts with '.Calc' and ends with '}' in the following example) and properties (individual lines within the sections) for changes you want. This example changes everything so your style sheet file most likely will not be this complex. (Or you could copy and paste the entire text in the shaded area, save it as a .css file, change some values and observe the changes to the calculator.)
/* graphic used behind the calculator name */
table.CalcHdr
{
  background-image: url(Images/ExampleHeaderBackground.jpg);
}
/* color for the table header background */
table.CalcHdr, .PopupMenu, .PopupMenuX, .PopupMenuItemOver, .PopupMenuItemNotEnabledOver
{
  background-color: #8F94BE;
}

/* color for the table body background */
table.Calc, .PopupMenuItem, .PopupMenuItemNotEnabled
{
  background-color: #E6E7F0;
}

/* font family, size and color for the calculator name in the header portion */
table.CalcHdr td
{
  font-family: Times, Serif;
  font-size: 20pt;
  color: #FFFF66;
}

/* font family, size and color for the field names in the calculator body */
.Calc td
{
  font-family: Sans-Serif;
  font-size: 10pt;
  color: #0000CC;
}

/* font family, size and color for the input fields in the calculator body */
.Calc input
{
  font-family: Monospace;
  font-size: 10pt;
  color: #624FAC;
}

/* font family, size and color for your company name in the header portion of the calculator */
.CompanyName
{
  font-family: Cursive, Fantasy;
  font-size: 16pt;
  color: #6A5250;
}

/* font family, size and color for copyright notice */
td.Copyright, .Copyright a
{
  font-family: Serif;
  font-size: 8pt;
  color: #CC3333;
}

/* font family, size and color for disclaimer */
td.Disclaimer
{
  font-family: Cursive;
  font-size: 7pt;
  color: #999999;
}
Blank Field Values     view
To have the calculator start up with all blank field values, you can set the InitParms parameter to 'N' as in the following example.
<script language="JavaScript" type="text/javascript">
<!--
//CC Minimum Payment (2006 Rules)
function CreditCardMinimumPayment()
{
  window.open('http://www.webcalcsolutions.com/Credit-Card-Calculators/Credit-Card-Minimum-Payment.asp?AcctNum=1&' +
    'HdrImg=http://www.webcalcsolutions.com/Images/ExampleImage.gif&' +
    'CSS=http://www.webcalcsolutions.com/MyStyles.css&' +
    'InitParms=N',
    '_blank',
    'width=430,height=660,directories=0,location=0,menubar=0,resizable=1,scrollbars=1,status=0,toolbar=0');
}

-->
</script>
<a href="javascript:CreditCardMinimumPayment();">CC Minimum Payment (2006 Rules)</a><br>
<br>
<a href='http://www.webcalcsolutions.com/' style='font-size: 8pt;'>Online Calculators - Financial Calculators, Health Calculators, and Health Assessments from WebCalcSolutions.com</a><br>
No Field Help Popup Text     view
To suppress the field help popup text, you can set the ShowHelp parameter to 'N' as in the following example.
<script language="JavaScript" type="text/javascript">
<!--
//CC Minimum Payment (2006 Rules)
function CreditCardMinimumPayment()
{
  window.open('http://www.webcalcsolutions.com/Credit-Card-Calculators/Credit-Card-Minimum-Payment.asp?AcctNum=1&' +
    'HdrImg=http://www.webcalcsolutions.com/Images/ExampleImage.gif&' +
    'CSS=http://www.webcalcsolutions.com/MyStyles.css&' +
    'ShowHelp=N',
    '_blank',
    'width=430,height=660,directories=0,location=0,menubar=0,resizable=1,scrollbars=1,status=0,toolbar=0');
}

-->
</script>
<a href="javascript:CreditCardMinimumPayment();">CC Minimum Payment (2006 Rules)</a><br>
<br>
<a href='http://www.webcalcsolutions.com/' style='font-size: 8pt;'>Online Calculators - Financial Calculators, Health Calculators, and Health Assessments from WebCalcSolutions.com</a><br>
Customizable Field Values     view
You can customize the following field values for this calculator. When the calculator runs it will have the values you set for these fields. Each calculator has a different set of customizable fields.

The following table shows all the customizable fields for the CC Minimum Payment (2006 Rules) calculator and the values used in the example script that follows:

CC Minimum Payment (2006 Rules)    view
CC Minimum Payment (2006 Rules) Calculator's
Customizable Fields
Screen Name Parm Name Parm Value Used in this Example
Title Title Visa's Plutonium Card
Credit Card Balance BalAmt 5,000.00
Interest Rate IntRate 12.5
Minimum Payment Percent MinPmtPct 2.5
Minimum Principal Percent MinPrinPct 1.25
Minimum Interest Amount IntMinAmt 1.50
Minimum Payment Amount MinPmtAmt 7.00

View Customized Calculator
<script language="JavaScript" type="text/javascript">
<!--
//CC Minimum Payment (2006 Rules)
function CreditCardMinimumPayment()
{
  window.open('http://www.webcalcsolutions.com/Credit-Card-Calculators/Credit-Card-Minimum-Payment.asp?AcctNum=1&' +
    'HdrImg=http://www.webcalcsolutions.com/Images/ExampleImage.gif&' +
    'CSS=http://www.webcalcsolutions.com/MyStyles.css&' +
    'Title=Visa%27s Plutonium Card&BalAmt=5,000.00&IntRate=12.5&MinPmtPct=2.5&' +
    'MinPrinPct=1.25&IntMinAmt=1.50&MinPmtAmt=7.00',
    '_blank',
    'width=430,height=660,directories=0,location=0,menubar=0,resizable=1,scrollbars=1,status=0,toolbar=0');
}

-->
</script>
<a href="javascript:CreditCardMinimumPayment();">CC Minimum Payment (2006 Rules)</a><br>
<br>
<a href='http://www.webcalcsolutions.com/' style='font-size: 8pt;'>Online Calculators - Financial Calculators, Health Calculators, and Health Assessments from WebCalcSolutions.com</a><br>

Our examples have special characters (& or ') that must be encoded to be interpreted properly by the browser. If the customized text you want to use has any of these characters (&, ' [apostrophe or single-quote], #, ?, ", \ or %) we have provided this Encode tool so you can see how to type it into your script. Enter your customized text then select 'Encode'. The encoded text will show up in the lower box and can be copied and pasted directly into your script.



Copy and Paste