Axis Bank EMI Calculator

:root{–background-color: #ffffff; –vigo-color: #2BBD3E; –slider-color: #2BBD3E; –input-number-color: #e7e5e5b7;}*{box-sizing: border-box;}.calcform{display: flex; justify-content: center; align-items: center; background-color: var(–background-color); color: #222;}#amountLabel{width: 210px;}.sip-calculator{border: 5px solid #ffffff; -moz-box-shadow: 0px 0px 5px hsla(12, 2%, 55%, 0.527); -webkit-box-shadow: 0px 0px 5px hsl(15, 2%, 55%); box-shadow: 0px 0px 10px hsl(0, 0%, 73.9%); padding: 3em; margin: 1em; width: 530px; background-color: #ffffff;}.sip-calculator-amount,.sip-calculator-year,.sip-calculator-roi{margin-bottom: 2.2em; width: 100%;}.amount-slider,.year-slider,.roi-slider{width: 100%; height: 2px; border-radius: 10px; background: var(–slider-color); outline: none;}input[type=”range”]{-moz-appearance: none; -webkit-appearance: none; appearance: none; cursor: pointer;}input[type=”range”]:focus{outline: none;}input[type=”range”]::-ms-track{width: 100%; cursor: pointer;}input[type=”range”]::-webkit-slider-thumb{-webkit-appearance: none; border: 2.5px solid var(–vigo-color); height: 20px; width: 20px; border-radius: 40px; background: white; cursor: pointer; margin-top: 0px;}input[type=”range”]::-moz-range-thumb{border: 2.5px solid var(–vigo-color); height: 20px; width: 20px; border-radius: 40px; background: white; cursor: pointer;}input[type=”range”]::-ms-thumb{border: 2.5px solid var(–vigo-color); height: 20px; width: 20px; border-radius: 40px; background: white; cursor: pointer;}input[type=”number”]{-moz-appearance: none; -webkit-appearance: none; cursor: pointer; background: var(–input-number-color); border-style: none; height: 30px; margin-left: 20px; margin-right: 10px; text-align: right; padding-right: 5px; font-family: “Roboto”, sans-serif; font-size: 1.5em; border-radius: 4px; /* float: right; */}input[type=”number”]:focus{outline: none; border: 1px solid #3197ee;}/* For radio */.radio{margin: 0.5rem; text-align: center;}.radio input[type=”radio”]{position: absolute; opacity: 0;}.radio input[type=”radio”] + .radio-label:before{content: “”; background: #f4f4f4; border-radius: 100%; border: 2px solid #2BBD3E; display: inline-block; width: 1.4em; height: 1.4em; position: relative; top: -0.2em; margin-right: 1em; vertical-align: top; cursor: pointer; text-align: center; transition: all 250ms ease;}.radio input[type=”radio”]:checked + .radio-label:before{background-color: #2BBD3E; box-shadow: inset 0 0 0 4px #f4f4f4;}.radio input[type=”radio”]:focus + .radio-label:before{outline: none; border-color: #3197ee;}.radio input[type=”radio”]:disabled + .radio-label:before{box-shadow: inset 0 0 0 4px #f4f4f4; border-color: #b4b4b4; background: #b4b4b4;}.radio input[type=”radio”] + .radio-label:empty:before{margin-right: 0;}/* Radio End */@media only screen and (max-width: 325px){.sip-calculator{height: 560px;}h1{font-size: 1.5em;}}@media (max-width: 576px){body{font-size: smaller;}.sip-calculator{width: 100%; padding: 2em; margin: 0.1em;}} “use strict”; var amountSlider=document.getElementById(“myAmount”); var amountOutput=document.getElementById(“inputAmount”); var roiSlider=document.getElementById(“myRoi”); var roiOutput=document.getElementById(“inputRoi”); var yearSlider=document.getElementById(“myYears”); var yearOutput=document.getElementById(“inputYears”); amountOutput.innerHTML=amountSlider.value; roiOutput.innerHTML=roiSlider.value; yearOutput.innerHTML=yearSlider.value; amountSlider.oninput=function (){amountOutput.innerHTML=this.value;}; roiSlider.oninput=function (){roiOutput.innerHTML=this.value;}; yearSlider.oninput=function (){yearOutput.innerHTML=this.value;}; function showValAmount(newVal){amountSlider.value=newVal; calculateIt();}function showValRoi(newVal){roiSlider.value=newVal; calculateIt();}function showValYears(newVal){yearSlider.value=newVal; calculateIt();}amountSlider.addEventListener(“input”, updateValueAmount); roiSlider.addEventListener(“input”, updateValueRoi); yearSlider.addEventListener(“input”, updateValueYears); function updateValueAmount(e){amountOutput.value=e.srcElement.value; calculateIt();}function updateValueRoi(e){roiOutput.value=e.srcElement.value; calculateIt();}function updateValueYears(e){yearOutput.value=e.srcElement.value; calculateIt();}function calculateIt(){var emiAmountValue=document.getElementById(“emiAmount”); var A=document.sipForm.realAmount.value; var R=document.sipForm.realRoi.value; var N=document.sipForm.realYears.value; var result=Math.round( (A * (R / 100 / 12) * Math.pow(1 + R / 100 / 12, N * 12)) / (Math.pow(1 + R / 100 / 12, N * 12) – 1) ); emiAmountValue.innerHTML=”Rs. ” + result;}calculateIt();