{"id":1027,"date":"2024-11-15T18:57:28","date_gmt":"2024-11-15T13:12:28","guid":{"rendered":"https:\/\/code-projects.org\/?p=1027"},"modified":"2024-11-15T18:57:28","modified_gmt":"2024-11-15T13:12:28","slug":"simple-game-html-css","status":"publish","type":"post","link":"https:\/\/code-projects.org\/simple-game-html-css\/","title":{"rendered":"Simple Game In HTML and CSS"},"content":{"rendered":"<h2>PROJECT: Simple\u00a0UI game using JavaScript<\/h2>\n<p>This is a simple UI game designed in HTML and JavaScript.This game includes HTML, CSS, javascript. object motion depends on the mouse cursor movement. The user will find it quite easy to play and handle the game. The user has to move the cursor by simply after clicking the player icon on the screen.<\/p>\n<p>You can also have a look at the video below for the demo:<\/p>\n<p><iframe loading=\"lazy\" title=\"SIMPLE GAME IN HTML AND CSS\" width=\"500\" height=\"281\" src=\"https:\/\/www.youtube.com\/embed\/gWFwGx2mq7o?feature=oembed\" frameborder=\"0\" allow=\"accelerometer; autoplay; clipboard-write; encrypted-media; gyroscope; picture-in-picture; web-share\" referrerpolicy=\"strict-origin-when-cross-origin\" allowfullscreen><\/iframe><\/p>\n<h3>Download Simple UI game source code :<\/h3>\n\n<p>[cpdownload=4232c48a-5b45-434c-a855-561828ca0c6a]<\/p>\n","protected":false},"excerpt":{"rendered":"<p>PROJECT: Simple\u00a0UI game using JavaScript This is a simple UI game designed in HTML and JavaScript.This game includes HTML, CSS, [&hellip;]<\/p>\n","protected":false},"author":20,"featured_media":1028,"comment_status":"open","ping_status":"open","sticky":false,"template":"","format":"standard","meta":{"site-sidebar-layout":"default","site-content-layout":"","ast-site-content-layout":"default","site-content-style":"default","site-sidebar-style":"default","ast-global-header-display":"","ast-banner-title-visibility":"","ast-main-header-display":"","ast-hfb-above-header-display":"","ast-hfb-below-header-display":"","ast-hfb-mobile-header-display":"","site-post-title":"","ast-breadcrumbs-content":"","ast-featured-img":"","footer-sml-layout":"","ast-disable-related-posts":"","theme-transparent-header-meta":"","adv-header-id-meta":"","stick-header-meta":"","header-above-stick-meta":"","header-main-stick-meta":"","header-below-stick-meta":"","astra-migrate-meta-layouts":"default","ast-page-background-enabled":"default","ast-page-background-meta":{"desktop":{"background-color":"var(--ast-global-color-5)","background-image":"","background-repeat":"repeat","background-position":"center center","background-size":"auto","background-attachment":"scroll","background-type":"","background-media":"","overlay-type":"","overlay-color":"","overlay-opacity":"","overlay-gradient":""},"tablet":{"background-color":"","background-image":"","background-repeat":"repeat","background-position":"center center","background-size":"auto","background-attachment":"scroll","background-type":"","background-media":"","overlay-type":"","overlay-color":"","overlay-opacity":"","overlay-gradient":""},"mobile":{"background-color":"","background-image":"","background-repeat":"repeat","background-position":"center center","background-size":"auto","background-attachment":"scroll","background-type":"","background-media":"","overlay-type":"","overlay-color":"","overlay-opacity":"","overlay-gradient":""}},"ast-content-background-meta":{"desktop":{"background-color":"var(--ast-global-color-4)","background-image":"","background-repeat":"repeat","background-position":"center center","background-size":"auto","background-attachment":"scroll","background-type":"","background-media":"","overlay-type":"","overlay-color":"","overlay-opacity":"","overlay-gradient":""},"tablet":{"background-color":"var(--ast-global-color-4)","background-image":"","background-repeat":"repeat","background-position":"center center","background-size":"auto","background-attachment":"scroll","background-type":"","background-media":"","overlay-type":"","overlay-color":"","overlay-opacity":"","overlay-gradient":""},"mobile":{"background-color":"var(--ast-global-color-4)","background-image":"","background-repeat":"repeat","background-position":"center center","background-size":"auto","background-attachment":"scroll","background-type":"","background-media":"","overlay-type":"","overlay-color":"","overlay-opacity":"","overlay-gradient":""}},"footnotes":""},"categories":[210,3],"tags":[340,54,21],"post_format":[],"class_list":["post-1027","post","type-post","status-publish","format-standard","has-post-thumbnail","hentry","category-jsprojects","category-project","tag-free-projects","tag-html-projects","tag-projects"],"yoast_head":"<!-- This site is optimized with the Yoast SEO plugin v27.4 - https:\/\/yoast.com\/product\/yoast-seo-wordpress\/ -->\n<title>Simple Game In HTML and CSS - Source Code &amp; Projects<\/title>\n<meta name=\"robots\" content=\"index, follow, max-snippet:-1, max-image-preview:large, max-video-preview:-1\" \/>\n<link rel=\"canonical\" href=\"https:\/\/code-projects.org\/simple-game-html-css\/\" \/>\n<meta property=\"og:locale\" content=\"en_US\" \/>\n<meta property=\"og:type\" content=\"article\" \/>\n<meta property=\"og:title\" content=\"Simple Game In HTML and CSS - Source Code &amp; Projects\" \/>\n<meta property=\"og:description\" content=\"PROJECT: Simple\u00a0UI game using JavaScript This is a simple UI game designed in HTML and JavaScript.This game includes HTML, CSS, [&hellip;]\" \/>\n<meta property=\"og:url\" content=\"https:\/\/code-projects.org\/simple-game-html-css\/\" \/>\n<meta property=\"og:site_name\" content=\"Source Code &amp; Projects\" \/>\n<meta property=\"article:published_time\" content=\"2024-11-15T13:12:28+00:00\" \/>\n<meta property=\"og:image\" content=\"https:\/\/code-projects.org\/wp-content\/uploads\/2017\/11\/Capture-1.png\" \/>\n\t<meta property=\"og:image:width\" content=\"686\" \/>\n\t<meta property=\"og:image:height\" content=\"244\" \/>\n\t<meta property=\"og:image:type\" content=\"image\/png\" \/>\n<meta name=\"author\" content=\"Carmelo Garcia\" \/>\n<meta name=\"twitter:card\" content=\"summary_large_image\" \/>\n<meta name=\"twitter:label1\" content=\"Written by\" \/>\n\t<meta name=\"twitter:data1\" content=\"Carmelo Garcia\" \/>\n<script type=\"application\/ld+json\" class=\"yoast-schema-graph\">{\"@context\":\"https:\\\/\\\/schema.org\",\"@graph\":[{\"@type\":\"Article\",\"@id\":\"https:\\\/\\\/code-projects.org\\\/simple-game-html-css\\\/#article\",\"isPartOf\":{\"@id\":\"https:\\\/\\\/code-projects.org\\\/simple-game-html-css\\\/\"},\"author\":{\"name\":\"Carmelo Garcia\",\"@id\":\"https:\\\/\\\/code-projects.org\\\/#\\\/schema\\\/person\\\/66a568e97b9ba7844033e1f44c8bf820\"},\"headline\":\"Simple Game In HTML and CSS\",\"datePublished\":\"2024-11-15T13:12:28+00:00\",\"mainEntityOfPage\":{\"@id\":\"https:\\\/\\\/code-projects.org\\\/simple-game-html-css\\\/\"},\"wordCount\":102,\"commentCount\":0,\"publisher\":{\"@id\":\"https:\\\/\\\/code-projects.org\\\/#\\\/schema\\\/person\\\/ad6c464da800d8658830febb9d1e5d53\"},\"image\":{\"@id\":\"https:\\\/\\\/code-projects.org\\\/simple-game-html-css\\\/#primaryimage\"},\"thumbnailUrl\":\"https:\\\/\\\/code-projects.org\\\/wp-content\\\/uploads\\\/2017\\\/11\\\/Capture-1.png\",\"keywords\":[\"free projects\",\"html projects\",\"projects\"],\"articleSection\":[\"JavaScript Projects\",\"Project\"],\"inLanguage\":\"en-US\",\"potentialAction\":[{\"@type\":\"CommentAction\",\"name\":\"Comment\",\"target\":[\"https:\\\/\\\/code-projects.org\\\/simple-game-html-css\\\/#respond\"]}]},{\"@type\":\"WebPage\",\"@id\":\"https:\\\/\\\/code-projects.org\\\/simple-game-html-css\\\/\",\"url\":\"https:\\\/\\\/code-projects.org\\\/simple-game-html-css\\\/\",\"name\":\"Simple Game In HTML and CSS - Source Code &amp; Projects\",\"isPartOf\":{\"@id\":\"https:\\\/\\\/code-projects.org\\\/#website\"},\"primaryImageOfPage\":{\"@id\":\"https:\\\/\\\/code-projects.org\\\/simple-game-html-css\\\/#primaryimage\"},\"image\":{\"@id\":\"https:\\\/\\\/code-projects.org\\\/simple-game-html-css\\\/#primaryimage\"},\"thumbnailUrl\":\"https:\\\/\\\/code-projects.org\\\/wp-content\\\/uploads\\\/2017\\\/11\\\/Capture-1.png\",\"datePublished\":\"2024-11-15T13:12:28+00:00\",\"breadcrumb\":{\"@id\":\"https:\\\/\\\/code-projects.org\\\/simple-game-html-css\\\/#breadcrumb\"},\"inLanguage\":\"en-US\",\"potentialAction\":[{\"@type\":\"ReadAction\",\"target\":[\"https:\\\/\\\/code-projects.org\\\/simple-game-html-css\\\/\"]}]},{\"@type\":\"ImageObject\",\"inLanguage\":\"en-US\",\"@id\":\"https:\\\/\\\/code-projects.org\\\/simple-game-html-css\\\/#primaryimage\",\"url\":\"https:\\\/\\\/code-projects.org\\\/wp-content\\\/uploads\\\/2017\\\/11\\\/Capture-1.png\",\"contentUrl\":\"https:\\\/\\\/code-projects.org\\\/wp-content\\\/uploads\\\/2017\\\/11\\\/Capture-1.png\",\"width\":686,\"height\":244},{\"@type\":\"BreadcrumbList\",\"@id\":\"https:\\\/\\\/code-projects.org\\\/simple-game-html-css\\\/#breadcrumb\",\"itemListElement\":[{\"@type\":\"ListItem\",\"position\":1,\"name\":\"Home\",\"item\":\"https:\\\/\\\/code-projects.org\\\/\"},{\"@type\":\"ListItem\",\"position\":2,\"name\":\"Simple Game In HTML and CSS\"}]},{\"@type\":\"WebSite\",\"@id\":\"https:\\\/\\\/code-projects.org\\\/#website\",\"url\":\"https:\\\/\\\/code-projects.org\\\/\",\"name\":\"Source Code &amp; Projects\",\"description\":\"Projects, Tutorials, and more\",\"publisher\":{\"@id\":\"https:\\\/\\\/code-projects.org\\\/#\\\/schema\\\/person\\\/ad6c464da800d8658830febb9d1e5d53\"},\"potentialAction\":[{\"@type\":\"SearchAction\",\"target\":{\"@type\":\"EntryPoint\",\"urlTemplate\":\"https:\\\/\\\/code-projects.org\\\/?s={search_term_string}\"},\"query-input\":{\"@type\":\"PropertyValueSpecification\",\"valueRequired\":true,\"valueName\":\"search_term_string\"}}],\"inLanguage\":\"en-US\"},{\"@type\":[\"Person\",\"Organization\"],\"@id\":\"https:\\\/\\\/code-projects.org\\\/#\\\/schema\\\/person\\\/ad6c464da800d8658830febb9d1e5d53\",\"name\":\"mysterioushoul\",\"image\":{\"@type\":\"ImageObject\",\"inLanguage\":\"en-US\",\"@id\":\"https:\\\/\\\/secure.gravatar.com\\\/avatar\\\/d98500cd3daff9ff16ff72f70ab6605a78dd404da144f3886ee3746243cdf6d3?s=96&d=monsterid&r=g\",\"url\":\"https:\\\/\\\/secure.gravatar.com\\\/avatar\\\/d98500cd3daff9ff16ff72f70ab6605a78dd404da144f3886ee3746243cdf6d3?s=96&d=monsterid&r=g\",\"contentUrl\":\"https:\\\/\\\/secure.gravatar.com\\\/avatar\\\/d98500cd3daff9ff16ff72f70ab6605a78dd404da144f3886ee3746243cdf6d3?s=96&d=monsterid&r=g\",\"caption\":\"mysterioushoul\"},\"logo\":{\"@id\":\"https:\\\/\\\/secure.gravatar.com\\\/avatar\\\/d98500cd3daff9ff16ff72f70ab6605a78dd404da144f3886ee3746243cdf6d3?s=96&d=monsterid&r=g\"}},{\"@type\":\"Person\",\"@id\":\"https:\\\/\\\/code-projects.org\\\/#\\\/schema\\\/person\\\/66a568e97b9ba7844033e1f44c8bf820\",\"name\":\"Carmelo Garcia\",\"image\":{\"@type\":\"ImageObject\",\"inLanguage\":\"en-US\",\"@id\":\"https:\\\/\\\/secure.gravatar.com\\\/avatar\\\/a4e665031eea0a2fd90872fd2c3845a826bd0a72abd1fb4894437d8f0caaf9e5?s=96&d=monsterid&r=g\",\"url\":\"https:\\\/\\\/secure.gravatar.com\\\/avatar\\\/a4e665031eea0a2fd90872fd2c3845a826bd0a72abd1fb4894437d8f0caaf9e5?s=96&d=monsterid&r=g\",\"contentUrl\":\"https:\\\/\\\/secure.gravatar.com\\\/avatar\\\/a4e665031eea0a2fd90872fd2c3845a826bd0a72abd1fb4894437d8f0caaf9e5?s=96&d=monsterid&r=g\",\"caption\":\"Carmelo Garcia\"},\"url\":\"https:\\\/\\\/code-projects.org\\\/author\\\/carmelo\\\/\"}]}<\/script>\n<!-- \/ Yoast SEO plugin. -->","yoast_head_json":{"title":"Simple Game In HTML and CSS - Source Code &amp; Projects","robots":{"index":"index","follow":"follow","max-snippet":"max-snippet:-1","max-image-preview":"max-image-preview:large","max-video-preview":"max-video-preview:-1"},"canonical":"https:\/\/code-projects.org\/simple-game-html-css\/","og_locale":"en_US","og_type":"article","og_title":"Simple Game In HTML and CSS - Source Code &amp; Projects","og_description":"PROJECT: Simple\u00a0UI game using JavaScript This is a simple UI game designed in HTML and JavaScript.This game includes HTML, CSS, [&hellip;]","og_url":"https:\/\/code-projects.org\/simple-game-html-css\/","og_site_name":"Source Code &amp; Projects","article_published_time":"2024-11-15T13:12:28+00:00","og_image":[{"width":686,"height":244,"url":"https:\/\/code-projects.org\/wp-content\/uploads\/2017\/11\/Capture-1.png","type":"image\/png"}],"author":"Carmelo Garcia","twitter_card":"summary_large_image","twitter_misc":{"Written by":"Carmelo Garcia"},"schema":{"@context":"https:\/\/schema.org","@graph":[{"@type":"Article","@id":"https:\/\/code-projects.org\/simple-game-html-css\/#article","isPartOf":{"@id":"https:\/\/code-projects.org\/simple-game-html-css\/"},"author":{"name":"Carmelo Garcia","@id":"https:\/\/code-projects.org\/#\/schema\/person\/66a568e97b9ba7844033e1f44c8bf820"},"headline":"Simple Game In HTML and CSS","datePublished":"2024-11-15T13:12:28+00:00","mainEntityOfPage":{"@id":"https:\/\/code-projects.org\/simple-game-html-css\/"},"wordCount":102,"commentCount":0,"publisher":{"@id":"https:\/\/code-projects.org\/#\/schema\/person\/ad6c464da800d8658830febb9d1e5d53"},"image":{"@id":"https:\/\/code-projects.org\/simple-game-html-css\/#primaryimage"},"thumbnailUrl":"https:\/\/code-projects.org\/wp-content\/uploads\/2017\/11\/Capture-1.png","keywords":["free projects","html projects","projects"],"articleSection":["JavaScript Projects","Project"],"inLanguage":"en-US","potentialAction":[{"@type":"CommentAction","name":"Comment","target":["https:\/\/code-projects.org\/simple-game-html-css\/#respond"]}]},{"@type":"WebPage","@id":"https:\/\/code-projects.org\/simple-game-html-css\/","url":"https:\/\/code-projects.org\/simple-game-html-css\/","name":"Simple Game In HTML and CSS - Source Code &amp; Projects","isPartOf":{"@id":"https:\/\/code-projects.org\/#website"},"primaryImageOfPage":{"@id":"https:\/\/code-projects.org\/simple-game-html-css\/#primaryimage"},"image":{"@id":"https:\/\/code-projects.org\/simple-game-html-css\/#primaryimage"},"thumbnailUrl":"https:\/\/code-projects.org\/wp-content\/uploads\/2017\/11\/Capture-1.png","datePublished":"2024-11-15T13:12:28+00:00","breadcrumb":{"@id":"https:\/\/code-projects.org\/simple-game-html-css\/#breadcrumb"},"inLanguage":"en-US","potentialAction":[{"@type":"ReadAction","target":["https:\/\/code-projects.org\/simple-game-html-css\/"]}]},{"@type":"ImageObject","inLanguage":"en-US","@id":"https:\/\/code-projects.org\/simple-game-html-css\/#primaryimage","url":"https:\/\/code-projects.org\/wp-content\/uploads\/2017\/11\/Capture-1.png","contentUrl":"https:\/\/code-projects.org\/wp-content\/uploads\/2017\/11\/Capture-1.png","width":686,"height":244},{"@type":"BreadcrumbList","@id":"https:\/\/code-projects.org\/simple-game-html-css\/#breadcrumb","itemListElement":[{"@type":"ListItem","position":1,"name":"Home","item":"https:\/\/code-projects.org\/"},{"@type":"ListItem","position":2,"name":"Simple Game In HTML and CSS"}]},{"@type":"WebSite","@id":"https:\/\/code-projects.org\/#website","url":"https:\/\/code-projects.org\/","name":"Source Code &amp; Projects","description":"Projects, Tutorials, and more","publisher":{"@id":"https:\/\/code-projects.org\/#\/schema\/person\/ad6c464da800d8658830febb9d1e5d53"},"potentialAction":[{"@type":"SearchAction","target":{"@type":"EntryPoint","urlTemplate":"https:\/\/code-projects.org\/?s={search_term_string}"},"query-input":{"@type":"PropertyValueSpecification","valueRequired":true,"valueName":"search_term_string"}}],"inLanguage":"en-US"},{"@type":["Person","Organization"],"@id":"https:\/\/code-projects.org\/#\/schema\/person\/ad6c464da800d8658830febb9d1e5d53","name":"mysterioushoul","image":{"@type":"ImageObject","inLanguage":"en-US","@id":"https:\/\/secure.gravatar.com\/avatar\/d98500cd3daff9ff16ff72f70ab6605a78dd404da144f3886ee3746243cdf6d3?s=96&d=monsterid&r=g","url":"https:\/\/secure.gravatar.com\/avatar\/d98500cd3daff9ff16ff72f70ab6605a78dd404da144f3886ee3746243cdf6d3?s=96&d=monsterid&r=g","contentUrl":"https:\/\/secure.gravatar.com\/avatar\/d98500cd3daff9ff16ff72f70ab6605a78dd404da144f3886ee3746243cdf6d3?s=96&d=monsterid&r=g","caption":"mysterioushoul"},"logo":{"@id":"https:\/\/secure.gravatar.com\/avatar\/d98500cd3daff9ff16ff72f70ab6605a78dd404da144f3886ee3746243cdf6d3?s=96&d=monsterid&r=g"}},{"@type":"Person","@id":"https:\/\/code-projects.org\/#\/schema\/person\/66a568e97b9ba7844033e1f44c8bf820","name":"Carmelo Garcia","image":{"@type":"ImageObject","inLanguage":"en-US","@id":"https:\/\/secure.gravatar.com\/avatar\/a4e665031eea0a2fd90872fd2c3845a826bd0a72abd1fb4894437d8f0caaf9e5?s=96&d=monsterid&r=g","url":"https:\/\/secure.gravatar.com\/avatar\/a4e665031eea0a2fd90872fd2c3845a826bd0a72abd1fb4894437d8f0caaf9e5?s=96&d=monsterid&r=g","contentUrl":"https:\/\/secure.gravatar.com\/avatar\/a4e665031eea0a2fd90872fd2c3845a826bd0a72abd1fb4894437d8f0caaf9e5?s=96&d=monsterid&r=g","caption":"Carmelo Garcia"},"url":"https:\/\/code-projects.org\/author\/carmelo\/"}]}},"_links":{"self":[{"href":"https:\/\/code-projects.org\/wp-json\/wp\/v2\/posts\/1027","targetHints":{"allow":["GET"]}}],"collection":[{"href":"https:\/\/code-projects.org\/wp-json\/wp\/v2\/posts"}],"about":[{"href":"https:\/\/code-projects.org\/wp-json\/wp\/v2\/types\/post"}],"author":[{"embeddable":true,"href":"https:\/\/code-projects.org\/wp-json\/wp\/v2\/users\/20"}],"replies":[{"embeddable":true,"href":"https:\/\/code-projects.org\/wp-json\/wp\/v2\/comments?post=1027"}],"version-history":[{"count":8,"href":"https:\/\/code-projects.org\/wp-json\/wp\/v2\/posts\/1027\/revisions"}],"predecessor-version":[{"id":30377,"href":"https:\/\/code-projects.org\/wp-json\/wp\/v2\/posts\/1027\/revisions\/30377"}],"wp:featuredmedia":[{"embeddable":true,"href":"https:\/\/code-projects.org\/wp-json\/wp\/v2\/media\/1028"}],"wp:attachment":[{"href":"https:\/\/code-projects.org\/wp-json\/wp\/v2\/media?parent=1027"}],"wp:term":[{"taxonomy":"category","embeddable":true,"href":"https:\/\/code-projects.org\/wp-json\/wp\/v2\/categories?post=1027"},{"taxonomy":"post_tag","embeddable":true,"href":"https:\/\/code-projects.org\/wp-json\/wp\/v2\/tags?post=1027"},{"taxonomy":"post_format","embeddable":true,"href":"https:\/\/code-projects.org\/wp-json\/wp\/v2\/post_format?post=1027"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}