[ Foro de Javascript ]

ayuda con javascript

19-Sep-2021 22:26
diego frausto
0 Respuestas

Desarrollar una página web en la que se le pida al usuario cuantas cajas articles se desean colocar. Si el usuario
captura un número menor a 8 se debe colocar las cajas seleccionadas en un color de letra f3c623 y un fondo
10375c. E ir colocadas de manera vertical. Si el número de cajas es mayor a 8, se debe colocar las cajas
seleccionadas en un color de letra 10375c y un fondo f3c623. Pero estas cajas deben de ir acomodadas en bloque
horizontal. Es necesario usar un promt para captura de datos, funciones, condiciones y eventos.

function mostrarFiguras(){
   var num = document.getElementById("numero").value;

   cu="";

   for(var i=0; i< num.length; i++){
       if(num[i].checked){
           var proceso = num[i].value;
       }
   }
   while(proceso){
       if(proceso >=8){
           for(var i = 0; i < num;i++){
           cu += "<div style='height: 50px; width:50px; background:green; display: inline-block; margin: 5px;'></div>";
       }
   }  
       else{
           for(var i = 0; i < num;i++){
           cu += "<div style='height: 50px; width:50px; background:red; display: inline-block; margin: 5px;'></div>";
       }
   }
   }
       document.getElementById("resultado").innerHTML = cu;
}

<!DOCTYPE html>
<html lang="en">
<head>
   <meta charset="UTF-8">
   <meta http-equiv="X-UA-Compatible" content="IE=edge">
   <meta name="viewport" content="width=device-width, initial-scale=1.0">
   <script type="text/javascript" src="../js/funcionescaja.js"></script>
   <link rel='stylesheet' type='text/css' href='../css/estilocaja.css'>
   <title>Programa 1</title>
</head>
<body>
   <nav id="menuPrincipal">
       <h1>
<a class="opcionMenuPrincipal" href="../html/index.html">¡ JavaScript !</a>
</h1>
   </nav>
   <br>
   <br>
   <section class="contenido quienesomos">
   <article id="datos" class="contenedor">
       <h1>Número de Cuadrados</h1>
       <input type="number" id="numero" placeholder="Introduce un número"/><br>  
       <br><input type="button" value="Mostrar" onclick="mostrarFiguras()"/>
   </article>
   <p id="resultado" class="res">¡Resultado!</p><br>
</section>
   <footer>
       <h1>
           <a id="pie">Elaborado por: Frausto Hernández, Diego Eduardo</a>
       </h1>
   </footer>
</html>

alguien me puede ayudar a como lograr esto por favor




(No se puede continuar esta discusión porque tiene más de dos meses de antigüedad. Si tienes dudas parecidas, abre un nuevo hilo.)