Dado electrónico básico utilizando la función getRandomInt

HTML
<div class="contenedor">
    <div class="numero" id="numero">1</div>
    <input type="button" value="Click" onclick="dado()">
</div>
CSS
.contenedor{
    width:150px;
    margin:0px auto;
    text-align:center;
}
.contenedor .numero{
    height:200px;
    font-size:10em;
    border-radius:5px;
    color:#e74c3c;
    background:#2c3e50;
}
.contenedor input{
    margin:10px;
}
JS
var num = document.getElementById("numero");

function dado(){
    var rd = getRandomInt(1,7);
    num.innerHTML = rd;
}


// Función disponible en la internet ---

function getRandomInt(min,max){
  return Math.floor(Math.random() * (max - min)) + min;
}

Autor: Diego

Publicado: 12/02/2019

Compartir Elemento Web

Donar a Compositu
Otras formas de ayudar
  • Compártelo en tus redes sociales.
  • Recomienda los elementos.
  • Regístrate Aquí
  • Deja tu comentario agradeciendo el aporte.

Descarga el código completo del Elemento Web y archivos necesarios (imágenes, librerias, plugins, frameword, etc)


Deprecated: trim(): Passing null to parameter #1 ($string) of type string is deprecated in /home/clas88ie/public_html/lib/general.php on line 254

Deprecated: trim(): Passing null to parameter #1 ($string) of type string is deprecated in /home/clas88ie/public_html/lib/general.php on line 254

Deja tu comentarioComentarios 3

denz Hace 7 años
Excelente aporte ... y vean mi versión que les parece: http://frelements.com/init/view/simulando-un-dado-electronico-con-setinterval-de-javascript/5c630dec2e6dc
1 0 | Responder | Reportar spam
Diego Hace 7 años
Vaya que mejoró pero no me convence cuando le hago varios click en el botón como que se bloquea o crea un bucle infinito. Cómo arreglo eso?
0 0 | Responder | Reportar spam
denz Hace 7 años
Bueno no pensé que harian varios click supongo que cuando tiras un dado no lo tiras varia veces al mismo tiempo.Digo no.XD
1 0 | Responder | Reportar spam