Taula de continguts:
- Subministraments
- Pas 1: obteniu el vostre editor de text
- Pas 2: descarregueu Die Faces
- Pas 3: Inicieu la codificació
- Pas 4:
- Pas 5: utilitzeu la funció Var i Math
- Pas 6: executeu
Vídeo: Com codificar un dau virtual aleatori simple: 6 passos
2024 Autora: John Day | [email protected]. Última modificació: 2024-01-30 08:12
Hola a tothom!!!!! Aquesta és la meva primera instrucció i us ensenyaré a codificar un dau virtual al vostre PC o telèfon intel·ligent. Estic fent servir HTML, JavaScript i CSS, espero que a tots us encantarà i no us oblideu de votar-me en el context següent.
Subministraments
1. Un bon editor de text al vostre telèfon intel·ligent o PC
Pas 1: obteniu el vostre editor de text
Aquí estic fent servir el meu telèfon intel·ligent com a editor de text aquí (AnWriter). També podeu utilitzar el bloc de notes del vostre PC o obtenir un bon editor de text en línia
Pas 2: descarregueu Die Faces
He descarregat algunes cares de l'1 al 6 que adjunto a aquest pas. Per tant, podeu descarregar la vostra preferida o utilitzar la meva (sou gratuït).
Vaig anomenar la meva segons les cares de la mort. Això és:
Die_face_1.png, Die_face_2-p.webp
Pas 3: Inicieu la codificació
Deseu el codi com a fitxer.html
Comenceu introduint la cara predeterminada que desitgeu mitjançant img src
Pas 4:
A continuació, necessitarem un botó per llançar els daus; ho fem afegint una funció de botó
DAUS DE ROLLS
Pas 5: utilitzeu la funció Var i Math
AGITAR ELS DAUS
funció getRand () {
var vu = Math.floor (Math.random () * 6) +1;
var vu2 = Math.floor (Math.random () * 6) +1;
var di = ["die_face_1.png", "die_face_2.png", "die_face_3.png", "die_face_4.png", "die_face_5.png", "die_face_6.png"];
document.getElementById ("daus"). src = di [vu-1];
document.getElementById ("dicl"). src = di [vu2-1];
}
Aquest és el codi complet, estudieu-lo i proveu-lo i assegureu-vos que obteniu la foto per obtenir l'efecte
I si necessiteu la meva ajuda sobre aquest codi, mencioneu-lo a la secció de comentaris
Podeu canviar el disseny si no us agrada, però ho prefereixo amb la finalitat per a la qual vull utilitzar-lo
Pas 6: executeu
executeu el codi al navegador perquè funcioni
Recomanat:
Experiments PWM de motor CC aleatori + Solució de problemes del codificador: 4 passos
Experiments PWM aleatoris de motor CC + Solució de problemes del codificador: sovint hi ha ocasions en què la brossa d'algú és el tresor d'un altre, i aquest va ser un d'aquests moments per a mi. Si heu estat seguint-me, probablement sabreu que vaig emprendre un enorme projecte per crear la meva pròpia impressora 3D CNC a partir de ferralla. Aquestes peces eren
Anell LED M5StickC ESP32 i NeoPixels Color aleatori: 7 passos
M5StickC ESP32 i NeoPixels LED Ring Color aleatori: en aquest projecte aprendrem a mostrar un color aleatori a NeoPixels LED Ring mitjançant una placa M5StickC ESP32
Blink Caos: Mapa Logístic Per a Blink aleatori: 5 passos
Blink Caos: Mapa Logístico Para Random Blink: Este es un instructable para un generador de aleatoriedad, utilitzant un mapa log í stico, que ara explico que és. Amb el mapa log í stico, es va entendre i va apagar un led de forma aleatòria. Pot servir simplement d'exemple de com a
Intermitent LED de 512 colors (aleatori): 13 passos
Intermitent LED de 512 colors (aleatori): aquest intermitent LED mostra 512 colors sense l'ús d'un microcontrolador. Un comptador binari de 9 bits genera un nombre pseudo-aleatori i 3 convertidors D / A (digital a analògic) condueixen els LED vermells, verds i blaus
Rellotge despertador aleatori (Arduino Leonardo): 3 passos
Rellotge despertador aleatori (Arduino Leonardo): crèdit parcial: https://create.arduino.cc/projecthub/EvdS/led-dice … Aquest despertador utilitza els daus Arduino per decidir si les alarmes sonaran o no. Quan els daus llancen un 6, el despertador sona durant uns 5 segons. Si no tira un 6, es