{"id":1529,"date":"2024-12-30T05:02:40","date_gmt":"2024-12-30T05:02:40","guid":{"rendered":"https:\/\/prongo.com\/jack\/"},"modified":"2024-12-30T05:02:41","modified_gmt":"2024-12-30T05:02:41","slug":"jack","status":"publish","type":"post","link":"https:\/\/prongo.com\/jack\/","title":{"rendered":"CopyCat Jack Game"},"content":{"rendered":"\n<style>\n    \/* Main styles for the inline iframe *\/\n    #iframeInline {\n        margin: 20px auto;\n        width: 100%; \/* Full width for the inline iframe *\/\n        max-width: 1200px; \/* Optional: Limit the width *\/\n        height: 460px; \/* Adjust height to fit the iframe *\/\n        text-align: center; \/* Centering the content *\/\n        display: flex;\n        flex-direction: column;\n        align-items: center;\n    }\n\n    #iframeInlineContent {\n        width: 100%;\n        height: 460px; \/* Ensure the iframe fills vertically *\/\n        border: none;\n    }\n\n    \/* Full-page iframe container styles *\/\n    #iframeFullPage {\n        display: none; \/* Hidden by default *\/\n        position: fixed;\n        top: 0;\n        left: 0;\n        width: 100%;\n        height: 100%;\n        z-index: 9999; \/* High priority *\/\n        background-color: white;\n    }\n\n    #iframeFullPage iframe {\n        width: 100%;\n        height: 100%;\n        border: none;\n    }\n\n    \/* Button to open the full-page view *\/\n    #fullPageButton {\n        display: inline-block;\n        margin-top: 20px;\n        background-color: #007BFF;\n        color: white;\n        border: none;\n        padding: 10px 20px;\n        font-size: 16px;\n        cursor: pointer;\n        border-radius: 5px;\n    }\n\n    \/* Button to close the full-page view *\/\n    #closeIframeButton {\n        position: fixed;\n        top: 10px;\n        right: 10px;\n        background-color: red;\n        color: white;\n        border: none;\n        padding: 10px 20px;\n        font-size: 16px;\n        cursor: pointer;\n        border-radius: 5px;\n        z-index: 10000; \/* Ensure it stays above other content *\/\n    }\n<\/style>\n\n<!-- Inline iframe -->\n<div id=\"iframeInline\">\n    <iframe loading=\"lazy\" id=\"iframeInlineContent\" src=\"https:\/\/prongo.com\/copyjack1\/\" style=\"border: 0px #ffffff none;\" name=\"myiFrame\" scrolling=\"no\" frameborder=\"1\" marginheight=\"0px\" marginwidth=\"0px\" height=\"100%\" width=\"100%\" allowfullscreen><\/iframe>\n    <button id=\"fullPageButton\">Fullscreen View<\/button>\n<\/div>\n\n<!-- Full-page iframe container -->\n<div id=\"iframeFullPage\">\n    <button id=\"closeIframeButton\">Close<\/button>\n    <iframe id=\"iframeFullScreenContent\" src=\"\" allowfullscreen=\"allowfullscreen\"><\/iframe>\n<\/div>\n\n<script>\n    document.addEventListener('DOMContentLoaded', function () {\n        const fullPageButton = document.getElementById('fullPageButton');\n        const iframeFullPage = document.getElementById('iframeFullPage');\n        const closeIframeButton = document.getElementById('closeIframeButton');\n        const iframeFullScreen = document.getElementById('iframeFullScreenContent');\n        const iframeInlineContent = document.getElementById('iframeInlineContent');\n\n        \/\/ Open full-page view\n        fullPageButton.addEventListener('click', () => {\n            iframeFullScreen.src = iframeInlineContent.src; \/\/ Copy the src from inline iframe\n            iframeFullPage.style.display = 'block'; \/\/ Show full-page container\n            \/\/ Trigger fullscreen mode\n            if (iframeFullPage.requestFullscreen) {\n                iframeFullPage.requestFullscreen();\n            } else if (iframeFullPage.mozRequestFullScreen) { \/\/ Firefox\n                iframeFullPage.mozRequestFullScreen();\n            } else if (iframeFullPage.webkitRequestFullscreen) { \/\/ Chrome, Safari, and Opera\n                iframeFullPage.webkitRequestFullscreen();\n            } else if (iframeFullPage.msRequestFullscreen) { \/\/ IE\/Edge\n                iframeFullPage.msRequestFullscreen();\n            }\n        });\n\n        \/\/ Close full-page view\n        closeIframeButton.addEventListener('click', () => {\n            iframeFullPage.style.display = 'none'; \/\/ Hide full-page container\n            iframeFullScreen.src = ''; \/\/ Clear the src to stop loading in the background\n            \/\/ Exit fullscreen mode\n            if (document.exitFullscreen) {\n                document.exitFullscreen();\n            } else if (document.mozCancelFullScreen) { \/\/ Firefox\n                document.mozCancelFullScreen();\n            } else if (document.webkitExitFullscreen) { \/\/ Chrome, Safari, and Opera\n                document.webkitExitFullscreen();\n            } else if (document.msExitFullscreen) { \/\/ IE\/Edge\n                document.msExitFullscreen();\n            }\n        });\n    });\n<\/script>\n\n\n\n\n<div style=\"height:42px\" aria-hidden=\"true\" class=\"wp-block-spacer\"><\/div>\n\n\n\n<p>Jack wants you to play his Copy Cat Jack game!<\/p>\n\n\n\n<h2 class=\"wp-block-heading\">CopyCat Jack Game!<\/h2>\n\n\n\n<p>The object of the game:&nbsp;Repeat the order of the colors with sounds.<br>How to play: Copy Cat Jack is like the Simon game. Click on the play button above. The game will start and you must watch the order in which the colors are given. The game starts off with one color and adds a new color when you repeat the order correctly. How good is your memory?<\/p>\n","protected":false},"excerpt":{"rendered":"<p>Fullscreen View Close Jack wants you to play his Copy Cat Jack game! CopyCat Jack Game! The object of the game:&nbsp;Repeat the order of the colors with sounds.How to play: Copy Cat Jack is like the Simon game. Click on the play button above. The game will start and you must watch the order in [&hellip;]<\/p>\n","protected":false},"author":1,"featured_media":3900,"comment_status":"closed","ping_status":"closed","sticky":false,"template":"","format":"standard","meta":{"_themeisle_gutenberg_block_has_review":false,"footnotes":""},"categories":[39,163,161,155,38,42,37,217,25,137,108],"tags":[365,339],"class_list":["post-1529","post","type-post","status-publish","format-standard","has-post-thumbnail","hentry","category-games","category-3rd-grade","category-4th-grade","category-5th-grade","category-ages3-6","category-ages6-9","category-ages9-12","category-creative-play","category-education","category-highlighted","category-top-games","tag-memory-game","tag-memory-match"],"views":1,"_links":{"self":[{"href":"https:\/\/prongo.com\/wp-json\/wp\/v2\/posts\/1529","targetHints":{"allow":["GET"]}}],"collection":[{"href":"https:\/\/prongo.com\/wp-json\/wp\/v2\/posts"}],"about":[{"href":"https:\/\/prongo.com\/wp-json\/wp\/v2\/types\/post"}],"author":[{"embeddable":true,"href":"https:\/\/prongo.com\/wp-json\/wp\/v2\/users\/1"}],"replies":[{"embeddable":true,"href":"https:\/\/prongo.com\/wp-json\/wp\/v2\/comments?post=1529"}],"version-history":[{"count":2,"href":"https:\/\/prongo.com\/wp-json\/wp\/v2\/posts\/1529\/revisions"}],"predecessor-version":[{"id":9083,"href":"https:\/\/prongo.com\/wp-json\/wp\/v2\/posts\/1529\/revisions\/9083"}],"wp:featuredmedia":[{"embeddable":true,"href":"https:\/\/prongo.com\/wp-json\/wp\/v2\/media\/3900"}],"wp:attachment":[{"href":"https:\/\/prongo.com\/wp-json\/wp\/v2\/media?parent=1529"}],"wp:term":[{"taxonomy":"category","embeddable":true,"href":"https:\/\/prongo.com\/wp-json\/wp\/v2\/categories?post=1529"},{"taxonomy":"post_tag","embeddable":true,"href":"https:\/\/prongo.com\/wp-json\/wp\/v2\/tags?post=1529"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}