Wir nicht<\/title>\n\n <style>\n body {\n margin: 0;\n background: #111;\n }\n\n #insect-stage {\n position: relative;\n width: 100%;\n max-width: 1200px;\n aspect-ratio: 16 \/ 9;\n margin: 0 auto;\n overflow: hidden;\n background: #050505;\n }\n\n #main-video,\n #image-canvas {\n position: absolute;\n inset: 0;\n width: 100%;\n height: 100%;\n }\n\n #main-video {\n object-fit: cover;\n opacity: 0;\n transform: scale(0.94);\n transition:\n opacity 1.2s ease,\n transform 1.2s ease;\n z-index: 1;\n background: black;\n }\n\n #image-canvas {\n z-index: 2;\n transition: opacity 0.9s ease;\n }\n\n #bug {\n position: absolute;\n z-index: 3;\n font-size: 34px;\n transform: translate(-50%, -50%);\n pointer-events: none;\n filter: drop-shadow(0 2px 4px rgba(0,0,0,0.9));\n }\n\n #video-buttons {\n position: absolute;\n right: 16px;\n bottom: 16px;\n z-index: 5;\n display: none;\n gap: 10px;\n }\n\n #video-buttons button {\n padding: 10px 16px;\n border: none;\n border-radius: 8px;\n background: rgba(0,0,0,0.75);\n color: white;\n font-size: 15px;\n cursor: pointer;\n }\n\n #video-buttons button:hover {\n background: rgba(0,0,0,0.95);\n }\n\n #insect-stage.video-visible #main-video {\n opacity: 1;\n transform: scale(1);\n }\n\n #insect-stage.video-visible #image-canvas {\n opacity: 0;\n pointer-events: none;\n }\n\n #insect-stage.video-visible #bug {\n display: none;\n }\n\n #insect-stage.video-visible #video-buttons {\n display: flex;\n }\n\n #insect-stage.fullscreen-mode {\n position: fixed;\n inset: 0;\n width: 100vw;\n height: 100vh;\n max-width: none;\n aspect-ratio: auto;\n z-index: 999999;\n background: black;\n }\n\n #insect-stage.fullscreen-mode #main-video {\n object-fit: contain;\n }\n\n @media (max-width: 700px) {\n #video-buttons {\n right: 10px;\n bottom: 10px;\n flex-direction: column;\n }\n\n #video-buttons button {\n font-size: 14px;\n padding: 9px 12px;\n }\n\n #bug {\n font-size: 28px;\n }\n }\n <\/style>\n<\/head>\n\n<body>\n\n <div id=\"insect-stage\">\n <video id=\"main-video\" playsinline controls preload=\"metadata\">\n <source src=\"https:\/\/echtjetzt.digital\/media\/wir_nicht\/film.mp4\" type=\"video\/mp4\">\n Dein Browser kann dieses Video nicht abspielen.\n <\/video>\n\n <canvas id=\"image-canvas\"><\/canvas>\n\n <div id=\"bug\">\ud83e\udeb2<\/div>\n\n <div id=\"video-buttons\">\n <button id=\"fullscreen-btn\">Film vergr\u00f6ssern<\/button>\n <button id=\"back-btn\">Zur\u00fcck<\/button>\n <\/div>\n <\/div>\n\n <script>\n const stage = document.getElementById(\"insect-stage\");\n const canvas = document.getElementById(\"image-canvas\");\n const ctx = canvas.getContext(\"2d\");\n const video = document.getElementById(\"main-video\");\n const bug = document.getElementById(\"bug\");\n const fullscreenBtn = document.getElementById(\"fullscreen-btn\");\n const backBtn = document.getElementById(\"back-btn\");\n\n const img = new Image();\n img.src = \"https:\/\/echtjetzt.digital\/media\/wir_nicht\/bild.jpg\";\n\n let bites = [];\n let startTime = null;\n const duration = 3000;\n\n function resizeCanvas() {\n const rect = stage.getBoundingClientRect();\n canvas.width = rect.width;\n canvas.height = rect.height;\n }\n\n function drawImageCover() {\n const cw = canvas.width;\n const ch = canvas.height;\n const iw = img.width;\n const ih = img.height;\n\n const scale = Math.max(cw \/ iw, ch \/ ih);\n const nw = iw * scale;\n const nh = ih * scale;\n const x = (cw - nw) \/ 2;\n const y = (ch - nh) \/ 2;\n\n ctx.globalCompositeOperation = \"source-over\";\n ctx.clearRect(0, 0, cw, ch);\n ctx.drawImage(img, x, y, nw, nh);\n }\n\n function createBitePoint(t) {\n const cw = canvas.width;\n const ch = canvas.height;\n\n const side = Math.floor(Math.random() * 4);\n let x;\n let y;\n\n if (side === 0) {\n x = Math.random() * cw;\n y = Math.random() * ch * 0.2;\n } else if (side === 1) {\n x = cw - Math.random() * cw * 0.2;\n y = Math.random() * ch;\n } else if (side === 2) {\n x = Math.random() * cw;\n y = ch - Math.random() * ch * 0.2;\n } else {\n x = Math.random() * cw * 0.2;\n y = Math.random() * ch;\n }\n\n const radius = 25 + Math.random() * 55 + t * 35;\n bites.push({ x, y, radius });\n\n bug.style.left = x + \"px\";\n bug.style.top = y + \"px\";\n bug.style.transform = \"translate(-50%, -50%) rotate(\" + (Math.random() * 360) + \"deg)\";\n }\n\n function animate(timestamp) {\n if (!startTime) startTime = timestamp;\n\n const elapsed = timestamp - startTime;\n const t = Math.min(elapsed \/ duration, 1);\n\n drawImageCover();\n\n ctx.globalCompositeOperation = \"destination-out\";\n\n for (const bite of bites) {\n ctx.beginPath();\n ctx.arc(bite.x, bite.y, bite.radius, 0, Math.PI * 2);\n ctx.fill();\n }\n\n if (elapsed < duration) {\n for (let i = 0; i < 4; i++) {\n createBitePoint(t);\n }\n\n requestAnimationFrame(animate);\n } else {\n stage.classList.add(\"video-visible\");\n video.play().catch(() => {\n console.log(\"Autoplay wurde vom Browser blockiert.\");\n });\n }\n }\n\n img.onload = () => {\n resizeCanvas();\n drawImageCover();\n requestAnimationFrame(animate);\n };\n\n window.addEventListener(\"resize\", () => {\n resizeCanvas();\n drawImageCover();\n });\n\n fullscreenBtn.addEventListener(\"click\", () => {\n stage.classList.toggle(\"fullscreen-mode\");\n\n if (stage.classList.contains(\"fullscreen-mode\")) {\n fullscreenBtn.textContent = \"Film verkleinern\";\n } else {\n fullscreenBtn.textContent = \"Film vergr\u00f6ssern\";\n }\n });\n\n backBtn.addEventListener(\"click\", () => {\n if (document.referrer) {\n history.back();\n } else {\n window.location.href = \"https:\/\/echtjetzt.digital\/\";\n }\n });\n <\/script>\n\n<\/body>\n<\/html>\n\n\n","protected":false},"excerpt":{"rendered":"<p>Wir nicht Dein Browser kann dieses Video nicht abspielen. \ud83e\udeb2 Film vergr\u00f6ssern Zur\u00fcck<\/p>\n","protected":false},"author":1,"featured_media":627,"comment_status":"open","ping_status":"closed","sticky":false,"template":"","format":"standard","meta":{"footnotes":""},"categories":[38],"tags":[86],"class_list":["post-623","post","type-post","status-publish","format-standard","has-post-thumbnail","hentry","category-meine-weissheiten","tag-schreien-nur-zusammen"],"_links":{"self":[{"href":"https:\/\/echtjetzt.digital\/index.php\/wp-json\/wp\/v2\/posts\/623","targetHints":{"allow":["GET"]}}],"collection":[{"href":"https:\/\/echtjetzt.digital\/index.php\/wp-json\/wp\/v2\/posts"}],"about":[{"href":"https:\/\/echtjetzt.digital\/index.php\/wp-json\/wp\/v2\/types\/post"}],"author":[{"embeddable":true,"href":"https:\/\/echtjetzt.digital\/index.php\/wp-json\/wp\/v2\/users\/1"}],"replies":[{"embeddable":true,"href":"https:\/\/echtjetzt.digital\/index.php\/wp-json\/wp\/v2\/comments?post=623"}],"version-history":[{"count":3,"href":"https:\/\/echtjetzt.digital\/index.php\/wp-json\/wp\/v2\/posts\/623\/revisions"}],"predecessor-version":[{"id":628,"href":"https:\/\/echtjetzt.digital\/index.php\/wp-json\/wp\/v2\/posts\/623\/revisions\/628"}],"wp:featuredmedia":[{"embeddable":true,"href":"https:\/\/echtjetzt.digital\/index.php\/wp-json\/wp\/v2\/media\/627"}],"wp:attachment":[{"href":"https:\/\/echtjetzt.digital\/index.php\/wp-json\/wp\/v2\/media?parent=623"}],"wp:term":[{"taxonomy":"category","embeddable":true,"href":"https:\/\/echtjetzt.digital\/index.php\/wp-json\/wp\/v2\/categories?post=623"},{"taxonomy":"post_tag","embeddable":true,"href":"https:\/\/echtjetzt.digital\/index.php\/wp-json\/wp\/v2\/tags?post=623"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}

{"id":623,"date":"2026-06-24T15:52:40","date_gmt":"2026-06-24T15:52:40","guid":{"rendered":"https:\/\/echtjetzt.digital\/?p=623"},"modified":"2026-06-24T15:58:02","modified_gmt":"2026-06-24T15:58:02","slug":"wir-nicht","status":"publish","type":"post","link":"https:\/\/echtjetzt.digital\/index.php\/2026\/06\/24\/wir-nicht\/","title":{"rendered":"Wir nicht"},"content":{"rendered":"\n\n\n\n\n \n \n Wir nicht<\/title>\n\n <style>\n body {\n margin: 0;\n background: #111;\n }\n\n #insect-stage {\n position: relative;\n width: 100%;\n max-width: 1200px;\n aspect-ratio: 16 \/ 9;\n margin: 0 auto;\n overflow: hidden;\n background: #050505;\n }\n\n #main-video,\n #image-canvas {\n position: absolute;\n inset: 0;\n width: 100%;\n height: 100%;\n }\n\n #main-video {\n object-fit: cover;\n opacity: 0;\n transform: scale(0.94);\n transition:\n opacity 1.2s ease,\n transform 1.2s ease;\n z-index: 1;\n background: black;\n }\n\n #image-canvas {\n z-index: 2;\n transition: opacity 0.9s ease;\n }\n\n #bug {\n position: absolute;\n z-index: 3;\n font-size: 34px;\n transform: translate(-50%, -50%);\n pointer-events: none;\n filter: drop-shadow(0 2px 4px rgba(0,0,0,0.9));\n }\n\n #video-buttons {\n position: absolute;\n right: 16px;\n bottom: 16px;\n z-index: 5;\n display: none;\n gap: 10px;\n }\n\n #video-buttons button {\n padding: 10px 16px;\n border: none;\n border-radius: 8px;\n background: rgba(0,0,0,0.75);\n color: white;\n font-size: 15px;\n cursor: pointer;\n }\n\n #video-buttons button:hover {\n background: rgba(0,0,0,0.95);\n }\n\n #insect-stage.video-visible #main-video {\n opacity: 1;\n transform: scale(1);\n }\n\n #insect-stage.video-visible #image-canvas {\n opacity: 0;\n pointer-events: none;\n }\n\n #insect-stage.video-visible #bug {\n display: none;\n }\n\n #insect-stage.video-visible #video-buttons {\n display: flex;\n }\n\n #insect-stage.fullscreen-mode {\n position: fixed;\n inset: 0;\n width: 100vw;\n height: 100vh;\n max-width: none;\n aspect-ratio: auto;\n z-index: 999999;\n background: black;\n }\n\n #insect-stage.fullscreen-mode #main-video {\n object-fit: contain;\n }\n\n @media (max-width: 700px) {\n #video-buttons {\n right: 10px;\n bottom: 10px;\n flex-direction: column;\n }\n\n #video-buttons button {\n font-size: 14px;\n padding: 9px 12px;\n }\n\n #bug {\n font-size: 28px;\n }\n }\n <\/style>\n<\/head>\n\n<body>\n\n <div id=\"insect-stage\">\n <video id=\"main-video\" playsinline controls preload=\"metadata\">\n <source src=\"https:\/\/echtjetzt.digital\/media\/wir_nicht\/film.mp4\" type=\"video\/mp4\">\n Dein Browser kann dieses Video nicht abspielen.\n <\/video>\n\n <canvas id=\"image-canvas\"><\/canvas>\n\n <div id=\"bug\">\ud83e\udeb2<\/div>\n\n <div id=\"video-buttons\">\n <button id=\"fullscreen-btn\">Film vergr\u00f6ssern<\/button>\n <button id=\"back-btn\">Zur\u00fcck<\/button>\n <\/div>\n <\/div>\n\n <script>\n const stage = document.getElementById(\"insect-stage\");\n const canvas = document.getElementById(\"image-canvas\");\n const ctx = canvas.getContext(\"2d\");\n const video = document.getElementById(\"main-video\");\n const bug = document.getElementById(\"bug\");\n const fullscreenBtn = document.getElementById(\"fullscreen-btn\");\n const backBtn = document.getElementById(\"back-btn\");\n\n const img = new Image();\n img.src = \"https:\/\/echtjetzt.digital\/media\/wir_nicht\/bild.jpg\";\n\n let bites = [];\n let startTime = null;\n const duration = 3000;\n\n function resizeCanvas() {\n const rect = stage.getBoundingClientRect();\n canvas.width = rect.width;\n canvas.height = rect.height;\n }\n\n function drawImageCover() {\n const cw = canvas.width;\n const ch = canvas.height;\n const iw = img.width;\n const ih = img.height;\n\n const scale = Math.max(cw \/ iw, ch \/ ih);\n const nw = iw * scale;\n const nh = ih * scale;\n const x = (cw - nw) \/ 2;\n const y = (ch - nh) \/ 2;\n\n ctx.globalCompositeOperation = \"source-over\";\n ctx.clearRect(0, 0, cw, ch);\n ctx.drawImage(img, x, y, nw, nh);\n }\n\n function createBitePoint(t) {\n const cw = canvas.width;\n const ch = canvas.height;\n\n const side = Math.floor(Math.random() * 4);\n let x;\n let y;\n\n if (side === 0) {\n x = Math.random() * cw;\n y = Math.random() * ch * 0.2;\n } else if (side === 1) {\n x = cw - Math.random() * cw * 0.2;\n y = Math.random() * ch;\n } else if (side === 2) {\n x = Math.random() * cw;\n y = ch - Math.random() * ch * 0.2;\n } else {\n x = Math.random() * cw * 0.2;\n y = Math.random() * ch;\n }\n\n const radius = 25 + Math.random() * 55 + t * 35;\n bites.push({ x, y, radius });\n\n bug.style.left = x + \"px\";\n bug.style.top = y + \"px\";\n bug.style.transform = \"translate(-50%, -50%) rotate(\" + (Math.random() * 360) + \"deg)\";\n }\n\n function animate(timestamp) {\n if (!startTime) startTime = timestamp;\n\n const elapsed = timestamp - startTime;\n const t = Math.min(elapsed \/ duration, 1);\n\n drawImageCover();\n\n ctx.globalCompositeOperation = \"destination-out\";\n\n for (const bite of bites) {\n ctx.beginPath();\n ctx.arc(bite.x, bite.y, bite.radius, 0, Math.PI * 2);\n ctx.fill();\n }\n\n if (elapsed < duration) {\n for (let i = 0; i < 4; i++) {\n createBitePoint(t);\n }\n\n requestAnimationFrame(animate);\n } else {\n stage.classList.add(\"video-visible\");\n video.play().catch(() => {\n console.log(\"Autoplay wurde vom Browser blockiert.\");\n });\n }\n }\n\n img.onload = () => {\n resizeCanvas();\n drawImageCover();\n requestAnimationFrame(animate);\n };\n\n window.addEventListener(\"resize\", () => {\n resizeCanvas();\n drawImageCover();\n });\n\n fullscreenBtn.addEventListener(\"click\", () => {\n stage.classList.toggle(\"fullscreen-mode\");\n\n if (stage.classList.contains(\"fullscreen-mode\")) {\n fullscreenBtn.textContent = \"Film verkleinern\";\n } else {\n fullscreenBtn.textContent = \"Film vergr\u00f6ssern\";\n }\n });\n\n backBtn.addEventListener(\"click\", () => {\n if (document.referrer) {\n history.back();\n } else {\n window.location.href = \"https:\/\/echtjetzt.digital\/\";\n }\n });\n <\/script>\n\n<\/body>\n<\/html>\n\n\n","protected":false},"excerpt":{"rendered":"<p>Wir nicht Dein Browser kann dieses Video nicht abspielen. \ud83e\udeb2 Film vergr\u00f6ssern Zur\u00fcck<\/p>\n","protected":false},"author":1,"featured_media":627,"comment_status":"open","ping_status":"closed","sticky":false,"template":"","format":"standard","meta":{"footnotes":""},"categories":[38],"tags":[86],"class_list":["post-623","post","type-post","status-publish","format-standard","has-post-thumbnail","hentry","category-meine-weissheiten","tag-schreien-nur-zusammen"],"_links":{"self":[{"href":"https:\/\/echtjetzt.digital\/index.php\/wp-json\/wp\/v2\/posts\/623","targetHints":{"allow":["GET"]}}],"collection":[{"href":"https:\/\/echtjetzt.digital\/index.php\/wp-json\/wp\/v2\/posts"}],"about":[{"href":"https:\/\/echtjetzt.digital\/index.php\/wp-json\/wp\/v2\/types\/post"}],"author":[{"embeddable":true,"href":"https:\/\/echtjetzt.digital\/index.php\/wp-json\/wp\/v2\/users\/1"}],"replies":[{"embeddable":true,"href":"https:\/\/echtjetzt.digital\/index.php\/wp-json\/wp\/v2\/comments?post=623"}],"version-history":[{"count":3,"href":"https:\/\/echtjetzt.digital\/index.php\/wp-json\/wp\/v2\/posts\/623\/revisions"}],"predecessor-version":[{"id":628,"href":"https:\/\/echtjetzt.digital\/index.php\/wp-json\/wp\/v2\/posts\/623\/revisions\/628"}],"wp:featuredmedia":[{"embeddable":true,"href":"https:\/\/echtjetzt.digital\/index.php\/wp-json\/wp\/v2\/media\/627"}],"wp:attachment":[{"href":"https:\/\/echtjetzt.digital\/index.php\/wp-json\/wp\/v2\/media?parent=623"}],"wp:term":[{"taxonomy":"category","embeddable":true,"href":"https:\/\/echtjetzt.digital\/index.php\/wp-json\/wp\/v2\/categories?post=623"},{"taxonomy":"post_tag","embeddable":true,"href":"https:\/\/echtjetzt.digital\/index.php\/wp-json\/wp\/v2\/tags?post=623"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}