Show Mortgage Calculator – Embed or Pop-Up in Seconds
Need to “show mortgage calculator” on any page fast? Grab the clean code below, or open the instant pop-up version. No ads, no tracking, fully responsive.
1. Copy Embed Code (HTML + CSS + JS)
<!-- Show Mortgage Calculator Embed -->
<style>
.smcalc{font-family:system-ui,Arial;max-width:420px;margin:auto;border:1px solid #ccd3db;border-radius:8px;padding:18px;background:#fff}
.smcalc h4{margin-top:0;color:#0066ff}
.smcalc label{font-size:14px;font-weight:600;display:block;margin-top:10px}
.smcalc input{width:100%;padding:8px;border:1px solid #ccd3db;border-radius:4px}
.smcalc button{background:#0066ff;color:#fff;border:none;padding:8px 14px;border-radius:4px;cursor:pointer;margin-top:12px}
.smcalc .smresult{font-weight:700;margin-top:10px}
</style>
<div class="smcalc">
<h4>Mortgage Payment</h4>
<label>Loan Amount ($)</label><input type="number" id="smLoan" value="300000">
<label>Rate (%)</label><input type="number" id="smRate" value="6.5" step="0.01">
<label>Term (years)</label><input type="number" id="smTerm" value="30">
<button onclick="smCalc()">Show Payment</button>
<div class="smresult" id="smOut"></div>
</div>
<script>
function smCalc(){
const p=document.getElementById('smLoan').value;
const r=document.getElementById('smRate').value/100/12;
const n=document.getElementById('smTerm').value*12;
const m=p*(r*Math.pow(1+r,n))/(Math.pow(1+r,n)-1);
document.getElementById('smOut').innerHTML='Monthly: <b>$'+m.toFixed(2)+'</b>';
}
smCalc();
</script>