Programacion

<HTML>
<HEAD>
	<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
	<meta name="viewport" content="width=device-width, user-scalable=no, initial-scale=1.0" />
	<title>Asociacion de Resistencias</title>
	<style>
	label {
		color: white;
		font-size: 30px;
		text-shadow: 7px 4px 5px black;
	}
	
	#valor{
		color: black;
		font-size: 60px;
		text-shadow: 3px 3px 3px white;
	}
	
	#resultado{
		color: white;
		font-size: 45px;
	}

select, .texto { 
		width: 90px; 
		height: 35px;
		font-size: 20px;
		background: #c1e9c7; 
		border-radius: .3em;
	}
	
	.btn {
	  border: none; 
	  color: white; 
	  padding: 14px 28px; 
	  cursor: pointer; 
	  border-radius: 5px; 
	}

.serie {background-color: #007bff;} 
	.serie:hover {background-color: #4b7dda;}

.paralelo {background-color: #04AA6D;} 
	.paralelo:hover {background-color: #46a049;}
	
	</style>
	<script>
	function calcular(tipo){
		const multiplos = [1,1000,1000000];
		var a = document.getElementById("R1").value;
		var b = document.getElementById("R2").value;
		var c = document.getElementById("uno").value;
		var d = document.getElementById("dos").value;
		var resultado;
		
		
		a=parseFloat(a);
		b=parseFloat(b);
		a = a * multiplos[c];
		b = b * multiplos[d];
		
		if (tipo == "serie"){
			resultado = (a + b);
		}else{
			resultado = ((a * b) / (a + b));
		}
		
		if (resultado >= 1000000){
			resultado = resultado / 1000000;
			resultado = resultado + "MΩ";
		}else{
			if (resultado >= 1000){
				resultado = resultado / 1000;
				resultado = resultado + "kΩ";
			}else{
				resultado = resultado + "Ω";
			}
		}
		
		document.getElementById("resultado").innerHTML = resultado;
		document.getElementById("valor").innerHTML = resultado;
		
	}
	</script>
</HEAD>
<BODY BGCOLOR="#77664c"	ALIGN="center">
	<label><u>Asociacion de Resistencias</u><label><BR>
	<br>
	Resistencia 1 = <input type="text" id="R1" value="100" class="texto">
	<select id="uno">
		<option value="0" selected>Ω</option>
		<option value="1">KΩ</option>
		<option value="2">MΩ</option>
	</select>
		<BR>
	Resistencia 2 = <input type="text" id="R2" value="100" class="texto">
	<select id="dos">
		<option value="0" selected>Ω</option>
		<option value="1">KΩ</option>
		<option value="2">MΩ</option>
	</select>
	<br><br>
	<input type="button" value="Calcular Serie" onClick="calcular('serie')" class="btn serie">
	<input type="button" value="Calcular Paralelo" onClick="calcular('paralelo')" class="btn paralelo">
	<br><br>
	<div id="resultado">XΩ</div>
	<br>
	<svg height="71mm" width="87mm" style="background-color: #fff;">
		<polyline points="30,50 60,50 70,30 80,70 90,30 100,70 110,30 120,70 130,50 200,50 210,30 220,70 230,30 240,70 250,30 260,70 270,50 300,50" style="fill:none; stroke:#000; stroke-width:1mm" />
		<circle cx="6mm" cy="13mm" r="1.5mm" style="fill: none; stroke: black; stroke-width: 1mm;" />
		<circle cx="81mm" cy="13mm" r="1.5mm" style="fill: none; stroke: black; stroke-width: 1mm;" />
		<polyline points="30,200 100,200 100,170 120,170 130,150 140,190 150,150 160,190 170,150 180,190 190,170 210,170 210,200 280,200" style="fill:none; stroke:#000; stroke-width:1mm" />
		<polyline points="100,200 100,230 120,230 130,210 140,250 150,210 160,250 170,210 180,250 190,230 210,230 210,200" style="fill:none; stroke:#000; stroke-width:1mm" />
		<circle cx="6mm" cy="53mm" r="1.5mm" style="fill: none; stroke: black; stroke-width: 1mm;" />
		<circle cx="75mm" cy="53mm" r="1.5mm" style="fill: none; stroke: black; stroke-width: 1mm;" />
		<text id="valor" x="22mm" y="33mm">XΩ</text>
	</svg>
</BODY>
</HTML>

Descargar archivo