![]() |
<!doctype html>
<meta charset="utf-8" name="viewport" content="width=device-width,initial-scale=1.0">
<link rel="stylesheet" type="text/css" href="style.css">
<link href="https://fonts.googleapis.com/css?family=Kalam" rel="stylesheet">
<script>
// Created by WapTrick360.wapka.site
var no = [48,24,36];
window.onload = function () {
hcf(no);
}
function change (){
var n = prompt("Enter numbers in a comma separated list eg. 10,20,45");
if(n!==null){
try {
hcf(eval("["+n+"]"));
} catch (e) {
alert("Invalid Input !");
}
}
}
function hcf(numbers) {
var c = document.getElementById('commonP');
var a = document.getElementById('ansP');
var p = document.getElementById('primesNP');
var n = document.getElementById('nosP');
n.innerHTML = numbers ;
p.innerHTML = "";
var primes = [];
var common;
var same = [];
for (var i=0 ; i<numbers.length ; i++) {
primes.push(prime(numbers[i]));
p.innerHTML+=numbers[i]+" = "+primes[i] + "<br>";
}
for(var first=0 ; first<primes[0].length ; first++ ) {
var t = 0;
for(var others=1 ; others<numbers.length ; others++ ) {
for(var otherPrimes=0 ; otherPrimes<primes[others].length ; otherPrimes++ ) {
if(primes[others][otherPrimes] == primes[0][first]) {
common = primes[others][otherPrimes];
primes[others].splice(otherPrimes,1);
t++;
break;
}
}
}
if(t==numbers.length-1){
same.push(common);
}
}
c.innerHTML = "Commons = "+same;
var ans = 1;
for(var i = 0 ; i<same.length ; i++) {
ans*=same[i];
}
a.innerHTML = "HCF = "+ans;
}
function prime (n) {
var arr = [] ;
var i = 2 ;
while(n!=1){
if(n%i == 0){
arr.push(i);
n/=i;
i=2;
}else{
i++;
}
}
return arr;
}
</script>
<style>
/* Created by WapTrick360.wapka.site */
*{
padding:0;margin:0;box-sizing: border-box;
}
h2{
position:absolute ;
width:100%;
color:rgba(0,0,0,0.9);
text-align:center;
top:6%;padding-bottom:5%;
border-bottom:2px solid black;
}
body{
background: rgb(150,200,190);
font-family: 'Kalam', cursive;
}
#base{
position: absolute;
width: 70%;height: 70%;
left: 15%;top: 20%;
max-width: 300px;
min-width: 224px;
border-radius: 1em;
background-color: #feeeee;
box-shadow: 5px 5px 15px rgba(0,0,0,0.3),
-5px -5px 15px rgba(0,0,0,0.2);
border:2px solid black;
box-sizing: border-box;
}
#ans{
position: absolute;
height: 15%;width: 100%;
background: white;
top: 85%;
border-radius: 0px 0px 1em 1em;
border-top:2px solid black;
box-sizing: border-box;
}
#ans p{
position:relative;
height: 50%;top: 25%;
font-size: 1.3em;
text-align: center;
vertical-align: middle;
}
#nos{
position: absolute;
height: 25%;width: 100%;
border-radius: 1em 1em 0em 0em;
border-bottom:2px solid black;
box-sizing: border-box;
}
#nosN{
position: relative;
top: 15%;
margin-left: 13%;
text-align: center;
display: inline;
font-size: 17px;
}
#nos button{
position: relative;
padding: 2%;margin-top: 0%;
background-color: #ddd;
border:1px solid black;
box-sizing: border-box;
border-radius: 0.5em;
top: 15%;margin-left: 27%;
display: inline;
}
#nosP{
position: absolute;
padding: 4%;padding-left: 12%;
width: 100%;
top: 44%;left: 0;
margin-top: 3%;
border-top: 1px solid black;
overflow-x: scroll;
}
#primes{
position: relative;
height: 45%;top: 25%;
width: 100%;
border-bottom:2px solid black;
}
#primesP{
position: relative;
padding: 4%;font-size: 17px;
padding-left: 12%;
border-bottom: 1px solid black;
}
#primesN{
position: absolute;
height: 75%;
top: 25%;overflow: scroll;
width: 100%;
}
#primesNP{
position: relative;
padding: 5%;
margin-left: 7%;
top: 5%;
}
#common{
position: relative;
height: 15%;width: 100%;
top: 25%;
overflow-x: scroll;
}
#commonP{
position: absolute;
height: 50%;
padding: 6%;
margin-left: 6%;
width: 88%;
font-size: 17px;
text-align: left;
}
</style>
<body id="b">
<h2>HCF of (n) numbers</h2>
<div id="base">
<!--Nubers to find the HCF of-->
<div id="nos">
<p id="nosN">Numbers</p><button id="change" onclick="change()">Change</button>
<p id="nosP"></p>
</div>
<!--Prime no. of the no.-->
<div id="primes"><p id="primesP">Primes of</p>
<div id="primesN">
<p id="primesNP"></p>
</div>
</div>
<!--Common no. among all the elements-->
<div id="common">
<p id="commonP">Commons - </p>
</div>
<!--Answer-->
<div id="ans">
<p id="ansP">HCF = </p>
</div>
</div>