Egyszerű véletlenszerű virtuális kockák kódolása: 6 lépés

Sziasztok!!!!! Ez az első utasításom, és megtanítom, hogyan kell kódolni egy virtuális kockát a számítógépén vagy okostelefonján. HTML -t, JavaScriptet és CSS -t használok, remélem, mindenkinek tetszeni fog, és ne felejtse el szavazni rám az alábbi kontextusban.

Kellékek

1. Jó szövegszerkesztő okostelefonon vagy számítógépen

1. lépés: Szerezze be a szövegszerkesztőt

Itt az okostelefonomat használom szövegszerkesztőként (AnWriter). Használhatja számítógépének jegyzettömbjét is, vagy beszerezhet egy jó szövegszerkesztőt az interneten

2. lépés: Töltse le a Die Faces -t

Letöltöttem néhány kockát 1 -től 6 -ig, amelyeket ehhez a lépéshez csatolok. Tehát letöltheti kedvencét, vagy használhatja az enyémet (ingyenes).

Az enyémet a kockalapok szerint neveztem el. Vagyis:

Die_face_1.png, Die_face_2.png… és így tovább 6 -ig a jobb felismerés érdekében

3. lépés: Indítsa el a kódolást

Mentse a kódot.html fájlként

Kezdje azzal, hogy az img src használatával bevezeti a kívánt alaplapot

4. lépés:

Ezután szükségünk lesz egy gombra a kockák dobásához, ezt gombfunkció hozzáadásával végezzük

DOBOZNI

5. lépés: Használja a Var és Math funkciót

DAY DAKE

függvény 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 ("kocka"). src = di [vu-1];

document.getElementById ("dicl"). src = di [vu2-1];

}

Ez a teljes kód, tanulmányozza és tesztelje, és győződjön meg róla, hogy megkapja a fotót, hogy megkapja a hatást

És ha szüksége van a segítségemre ezzel a kóddal kapcsolatban, említse meg a megjegyzések részben

Megváltoztathatod a dizájnt, ha nem tetszik, de én inkább arra a célra használom, amire használni szeretném

6. lépés: Fuss

futtassa a kódot a böngészőben, hogy működjön