diff --git a/src/assets/Design/castel waylongroad.png b/src/assets/Design/wayland.png similarity index 100% rename from src/assets/Design/castel waylongroad.png rename to src/assets/Design/wayland.png diff --git a/src/css/game.css b/src/css/game.css index e69de29..de222db 100644 --- a/src/css/game.css +++ b/src/css/game.css @@ -0,0 +1,47 @@ +.container-third .bg{ + width: 100%; + height: 100dvh; +} + +.container-third .bg{ + position: relative; +} + +.container-third .anm { + font-size: 100px; + background-size: cover; + position: absolute; + top: 100px; + text-align: center; + width: 100%; + display: none; +} + +.container-third .bg img{ + width: 100%; + position: absolute; + bottom: 0; + image-rendering: pixelated; + background-repeat: no-repeat; + background-size: cover; +} + +.container-third .hero img{ + width: 150px; + position: absolute; + bottom: 100px; + left: 50px; + image-rendering: pixelated; + background-repeat: no-repeat; + background-size: cover; +} + +.container-third .boss img{ + width: 300px; + position: absolute; + bottom: 100px; + right: 50px; + image-rendering: pixelated; + background-repeat: no-repeat; + background-size: cover; +} \ No newline at end of file diff --git a/src/game/firstperson.html b/src/game/firstperson.html index e69de29..4c0e320 100644 --- a/src/game/firstperson.html +++ b/src/game/firstperson.html @@ -0,0 +1,11 @@ + + + + + + firstperson + + +

+ + \ No newline at end of file diff --git a/src/game/thirdperson.html b/src/game/thirdperson.html index e69de29..a08fa71 100644 --- a/src/game/thirdperson.html +++ b/src/game/thirdperson.html @@ -0,0 +1,28 @@ + + + + + + thirdperson + + + + + +
+

PYTHON QUIZ GAME

+
+ bg +
+
+ +
+
+ +
+
+ + + + + \ No newline at end of file diff --git a/src/js/game.js b/src/js/game.js index e69de29..04f6d61 100644 --- a/src/js/game.js +++ b/src/js/game.js @@ -0,0 +1,36 @@ +const txt = document.getElementById('wellcome-message'); +const hero = document.getElementById('hero'); +const boss = document.getElementById('boss'); + +boss.style.transition = '2s cubic-bezier(0.4, 0, 0.2, 1)'; +hero.style.transition = '2s cubic-bezier(0.4, 0, 0.2, 1)'; +txt.style.transition = 'opacity .6s cubic-bezier(0.4, 0, 0.2, 1)'; +txt.style.opacity = '0'; +txt.style.display = 'block'; + + +setTimeout(() => { + txt.style.opacity = '1'; +}, 1000); + + +setTimeout(() => { + txt.style.opacity = '0'; + + setTimeout(() => { + txt.style.display = 'none'; +}, 400); +}, 5000); + +setTimeout(() => { + hero.style.left = '800px'; +}, 500); +setTimeout(() => { + boss.style.right = '700px'; +}, 500); + +setTimeout(()=> { + window.location.href = "/src/game/firstperson.html" +}, 7000) + +