Ako kódovať jednoduchú náhodnú virtuálnu kocku: 6 krokov
Ako kódovať jednoduchú náhodnú virtuálnu kocku: 6 krokov

Obsah:

Anonim
Ako kódovať jednoduché náhodné virtuálne kocky
Ako kódovať jednoduché náhodné virtuálne kocky

Ahoj všetci!!!!! Toto je môj prvý pokyn a naučím vás kódovať virtuálne kocky na počítači alebo smartfóne. Používam HTML, JavaScript a CSS, dúfam, že sa vám to bude všetkým páčiť a nezabudnite mi dať svoj hlas v kontexte nižšie.

Zásoby

1. Dobrý textový editor vo vašom smartfóne alebo počítači

Krok 1: Získajte textový editor

Tu používam svoj smartphone ako textový editor (AnWriter). Môžete tiež použiť poznámkový blok počítača alebo si zaobstarať dobrý textový editor online

Krok 2: Stiahnite si Die Faces

Stiahnite si Die Faces
Stiahnite si Die Faces
Stiahnite si Die Faces
Stiahnite si Die Faces
Stiahnite si Die Faces
Stiahnite si Die Faces

Stiahol som si niekoľko tvárí od 1 do 6, ktoré prikladám k tomuto kroku. Môžete si teda stiahnuť ten, ktorý uprednostňujete, alebo použiť ten môj (ste zadarmo).

Svoju som pomenoval podľa tvárí. To je:

Die_face_1.png, Die_face_2.png…. A tak ďalej do 6 pre lepšie rozpoznanie

Krok 3: Začnite kódovať

Uložte kód ako súbor.html

Začnite tým, že pomocou img src predstavíte požadovanú predvolenú tvár matrice

Krok 4:

Ďalej budeme potrebovať tlačidlo na hodenie kockami, urobíme to pridaním funkcie tlačidla

ROLL DICE

Krok 5: Použite funkciu Var a matematika

Použite funkciu Var a Math
Použite funkciu Var a Math

ROZKRASNÚŤ KOSTKY

funkcia 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 ("kocky"). src = di [vu-1];

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

}

Toto je úplný kód, preštudujte si ho, otestujte a uistite sa, že získate fotografiu, aby ste dosiahli efekt

A ak potrebujete moju pomoc s týmto kódom, uveďte to v sekcii komentárov

Dizajn môžete zmeniť, ak sa vám nepáči, ale ja ho preferujem na účel, na ktorý ho chcem použiť

Krok 6: Spustite

spustite kód vo svojom prehliadači, aby fungoval