สารบัญ:
2025 ผู้เขียน: John Day | [email protected]. แก้ไขล่าสุด: 2025-01-13 06:58
สวัสดีทุกคน!!!!! นี่เป็นคำสั่งแรกของฉันและฉันจะสอนวิธีเขียนโค้ดลูกเต๋าเสมือนจริงบนพีซีหรือสมาร์ทโฟนของคุณ ฉันใช้ HTML, JavaScript และ CSS ฉันหวังว่าคุณจะชอบมัน และอย่าลืมโหวตให้ฉันในบริบทด้านล่าง
เสบียง
1. โปรแกรมแก้ไขข้อความที่ดีบนสมาร์ทโฟนหรือพีซีของคุณ
ขั้นตอนที่ 1: รับโปรแกรมแก้ไขข้อความของคุณ
ที่นี่ฉันใช้สมาร์ทโฟนเป็นโปรแกรมแก้ไขข้อความที่นี่ (AnWriter) คุณสามารถใช้แผ่นจดบันทึกของพีซีได้เช่นกัน หรือซื้อโปรแกรมแก้ไขข้อความออนไลน์ที่ดี
ขั้นตอนที่ 2: ดาวน์โหลด Die Faces
ฉันดาวน์โหลดใบหน้าตายบางส่วนจาก 1 ถึง 6 ซึ่งฉันแนบมากับขั้นตอนนี้ ดังนั้นคุณสามารถดาวน์โหลดอันที่คุณต้องการหรือใช้ของฉันได้ (คุณว่าง)
ฉันตั้งชื่อของฉันตามใบหน้าที่ตาย นั่นคือ:
Die_face_1.png, Die_face_2-p.webp
ขั้นตอนที่ 3: เริ่มการเข้ารหัส
บันทึกโค้ดเป็นไฟล์.html
เริ่มต้นด้วยการแนะนำหน้าตายเริ่มต้นที่คุณต้องการโดยใช้ img src
ขั้นตอนที่ 4:
ต่อไปเราจะต้องใช้ปุ่มในการทอยลูกเต๋า โดยเพิ่มฟังก์ชั่นปุ่ม
ทอยลูกเต๋า
ขั้นตอนที่ 5: ใช้ฟังก์ชัน Var และคณิตศาสตร์
เขย่าลูกเต๋า
ฟังก์ชัน 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("dice").src= di[vu-1];
document.getElementById("dicl").src= di[vu2-1];
}
นี่คือรหัสฉบับเต็ม ศึกษาและทดสอบและตรวจดูให้แน่ใจว่าคุณได้รูปภาพเพื่อรับเอฟเฟกต์
และถ้าคุณต้องการความช่วยเหลือของฉันเกี่ยวกับรหัสนี้ให้พูดถึงในส่วนความคิดเห็น
คุณสามารถเปลี่ยนการออกแบบได้ถ้าคุณไม่ชอบมัน แต่ฉันชอบมันเพื่อจุดประสงค์ฉันต้องการใช้มันเพื่อ
ขั้นตอนที่ 6: เรียกใช้
รันโค้ดบนเบราว์เซอร์ของคุณเพื่อให้มันทำงาน