Sadržaj:

Kako kodirati jednostavnu slučajnu virtualnu kocku: 6 koraka
Kako kodirati jednostavnu slučajnu virtualnu kocku: 6 koraka

Video: Kako kodirati jednostavnu slučajnu virtualnu kocku: 6 koraka

Video: Kako kodirati jednostavnu slučajnu virtualnu kocku: 6 koraka
Video: Horizon: Forbidden West (The Movie) 2024, Novembar
Anonim
Kako kodirati jednostavnu slučajnu virtualnu kocku
Kako kodirati jednostavnu slučajnu virtualnu kocku

Zdravo svima!!!!! Ovo je moje prvo uputstvo i naučit ću vas kako kodirati virtualne kockice na računaru ili pametnom telefonu. Koristim HTML, JavaScript i CSS, nadam se da će vam se svidjeti i ne zaboravite glasati za mene u donjem kontekstu.

Supplies

1. Dobar uređivač teksta na vašem pametnom telefonu ili računaru

Korak 1: Preuzmite uređivač teksta

Ovdje koristim svoj pametni telefon kao uređivač teksta (AnWriter). Možete koristiti i bilježnicu na računaru ili nabaviti dobar uređivač teksta na mreži

Korak 2: Preuzmite Die Faces

Preuzmite Die Faces
Preuzmite Die Faces
Preuzmite Die Faces
Preuzmite Die Faces
Preuzmite Die Faces
Preuzmite Die Faces

Preuzeo sam neke matrice od 1 do 6 koje prilažem ovom koraku. Dakle, možete preuzeti željeni ili koristiti moj (besplatni ste).

Ja sam svoje nazvao prema licima umrlih. To je:

Die_face_1.png, Die_face_2-p.webp

Korak 3: Pokrenite kodiranje

Sačuvajte kôd kao.html datoteku

Započnite uvođenjem zadanog matrice lica koje želite pomoću img src

Korak 4:

Zatim će nam trebati dugme za bacanje kockica. To radimo dodavanjem funkcije dugmeta

ROLL DICE

Korak 5: Koristite funkciju Var i Matematika

Koristite funkciju Var i Matematika
Koristite funkciju Var i Matematika

PROTREŠI KOCKU

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

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

}

Ovo je cijeli kod, proučite ga i testirajte te se pobrinite da dobijete fotografiju da biste dobili efekt

A ako vam treba moja pomoć oko ovog koda, navedite ga u odjeljku za komentare

Možete promijeniti dizajn ako vam se ne sviđa, ali ja ga preferiram u svrhu za koju ga želim koristiti

Korak 6: Pokrenite

pokrenite kôd u svom pregledniku da bi funkcionirao

Preporučuje se: