Net2025

Browser lacks capabilities required to play.

Upgrade or switch to another browser.

Loading…

<<script>> window.cookieAccepted = false; window.surveyStep = 0; window.nextTarget = null; window.revealedTargets = new Set(); // 👈 이미 열린 콘텐츠를 추적 $(document).ready(function() { $(".survey-button").click(function() { const target = $(this).data("target"); window.nextTarget = target; // 이미 열린 콘텐츠인 경우 → 그냥 토글만 if (window.revealedTargets.has(target)) { $("#" + target + "-content").slideToggle(); return; } // 쿠키 수락 전 if (!window.cookieAccepted) { $("#cookie-popup").fadeIn(); return; } // 설문 순서에 따라 보여주기 if (window.surveyStep === 0) { $("#survey1-popup").fadeIn(); return; } if (window.surveyStep === 1) { $("#survey2-popup").fadeIn(); return; } if (window.surveyStep === 2) { $("#survey3-popup").fadeIn(); return; } // 모든 설문 완료 후 → 콘텐츠 보여주기 $("#" + target + "-content").slideToggle(); window.revealedTargets.add(target); // 완료 후에는 추적 }); // 쿠키 허용 $("#cookie-accept").click(function() { window.cookieAccepted = true; $("#cookie-popup").fadeOut(); if (window.nextTarget !== null) { $("#" + window.nextTarget + "-content").slideDown(); window.revealedTargets.add(window.nextTarget); // 👈 최초 오픈 등록 } }); // 팝업 닫기 $(".popup-close").click(function() { $(this).closest(".popup").fadeOut(); }); // 설문 1 제출 $("#survey1-submit").click(function() { let valid = true; $("#survey1-popup input").each(function() { if ($(this).val().trim() === "") valid = false; }); if (valid) { $("#survey1-popup").fadeOut(); window.surveyStep++; if (window.nextTarget !== null) { $("#" + window.nextTarget + "-content").slideDown(); window.revealedTargets.add(window.nextTarget); // 설문 완료 후 등록 } } else { alert("모든 항목을 입력해 주세요."); } }); // 설문 2 제출 $("#survey2-submit").click(function() { let value = $("#recent-payment").val().trim(); if (value !== "") { $("#survey2-popup").fadeOut(); window.surveyStep++; if (window.nextTarget !== null) { $("#" + window.nextTarget + "-content").slideDown(); window.revealedTargets.add(window.nextTarget); } } else { alert("입력해 주세요."); } }); // 설문 3 제출 $("#survey3-submit").click(function() { let value = $("#recent-dream").val().trim(); if (value !== "") { $("#survey3-popup").fadeOut(); window.surveyStep++; if (window.nextTarget !== null) { $("#" + window.nextTarget + "-content").slideDown(); window.revealedTargets.add(window.nextTarget); } } else { alert("입력해 주세요."); } }); }); <</script>> <style> @import url('https://fonts.googleapis.com/css2?family=Nanum+Gothic+Coding&display=swap'); body { background: white; color: black; font-family: 'Hack', monospace; font-family: 'Nanum Gothic Coding', monospace; } #ui-bar { display: none; } .header { position: fixed; top: 1em; left: 1em; text-align: left; } .header p { color: gray; font-size: 0.8em; } :root { /* 고정 박스 너비 제거 */ /* --box-width: 700px; */ } .grid { display: flex; flex-direction: column; align-items: center; width: 100%; max-width: 700px; min-width: 300px; margin: 0 auto; box-sizing: border-box; } .survey-button { width: 100%; max-width: 700px; min-width: 300px; background-color: black; color: white; padding: 1.2em; cursor: pointer; font-weight: bold; text-align: center; border: 1px solid black; margin: 0.5em 0; /* 위아래 여백 설정 */ font-size: 1.1em; box-sizing: border-box; } .survey-content { display: none; width: 100%; max-width: 700px; min-width: 300px; padding: 1.5em; /* margin-top 제거 */ margin-bottom: 1.5em; /* 콘텐츠 아래 여백만 적용 */ border: 1px solid black; background-color: white; box-sizing: border-box; } /* 이미지 반응형 정렬 */ .survey-content img { display: block; margin: 1em auto; max-width: 100%; height: auto; } .popup { display: none; position: fixed; top: 20%; left: 50%; transform: translateX(-50%); background: white; border: 2px solid black; padding: 2em; z-index: 9999; width: 350px; text-align: center; } .popup input { width: 100%; margin-bottom: 1em; padding: 0.5em; color: black; } .popup-buttons { display: flex; justify-content: center; gap: 0.5em; /* 버튼 간격 */ margin-top: 1em; } .popup-buttons button { padding: 0.5em 1em; cursor: pointer; border: none; } #cookie-popup button { margin-right: 1em; } .popup input::placeholder { color: gray; } </style> <div class="header"> <h1>NET NET NET : Entanglement<br> 넷넷넷 : 얽힘 2025 </h1> <p>@ADKI</p> </div> <div class="grid"> <div> <button class="survey-button" data-target="work1">작품에 대하여 1</button> <div id="work1-content" class="survey-content"> <p>이곳에 작품 2의 설명이 표시됩니다. (예: 이 작품은 당신의 움직임을 디지털 노이즈로 해석하여 시각화합니다.)</p> <img src="https://drive.google.com/uc?export=view&id=1u4WBT9PwWrt9cOw7fcUvzPpkHEVKudlY" alt="work1"> </div> </div> <div> <button class="survey-button" data-target="work2">작품에 대하여 2</button> <div id="work2-content" class="survey-content"> <p>이곳에 작품 2의 설명이 표시됩니다. (예: 이 작품은 당신의 움직임을 디지털 노이즈로 해석하여 시각화합니다.)</p> <img src="https://drive.google.com/uc?export=view&id=1B3DdOwoYHTk4-JDJZRRQzPvS3FxXeaFw" alt="work2"> </div> </div> <div> <button class="survey-button" data-target="aboutartist">작가에 대하여</button> <div id="aboutartist-content" class="survey-content"> <p>이곳에 작품 2의 설명이 표시됩니다. (예: 이 작품은 당신의 움직임을 디지털 노이즈로 해석하여 시각화합니다.)</p> <img src="https://drive.google.com/uc?export=view&id=1Qg1OXfw2CLcnPxgPW185669_2GIPItrF" alt="aboutartist"> </div> </div> <div> <button class="survey-button" data-target="aboutspace">이 공간에 대하여</button> <div id="aboutspace-content" class="survey-content"> <p>이곳에 작품 2의 설명이 표시됩니다. (예: 이 작품은 당신의 움직임을 디지털 노이즈로 해석하여 시각화합니다.)</p> <img src="https://drive.google.com/uc?export=view&id=197AQKqCMAONR8llWg9dk2KOTkgrfMNO0" alt="aboutspace"> </div> </div> </div>  <div id="cookie-popup" class="popup"> <p>사용자 경험 향상을 위해 쿠키를 사용합니다.<br>쿠키를 허용하시겠습니까?</p> <div class="popup-buttons"> <button id="cookie-accept">예</button> <button>아니요</button> </div> </div>  <div id="survey1-popup" class="popup"> <p>상세 페이지에 접근하기 위해 로봇이 아님을 인증하세요.<br>당신은 누구십니까?</p> <input type="text" placeholder="이름"> <input type="text" placeholder="성별"> <input type="text" placeholder="사는 곳"> <div class="popup-buttons"> <button id="survey1-submit">제출</button> <button class="popup-close">닫기</button> </div> </div>  <div id="survey2-popup" class="popup"> <p>당신은 실재하는 인물입니까?<br>최근 카드로 결제한 것은 무엇입니까?</p> <input type="text" id="recent-payment" placeholder="예: 편의점 커피"> <div class="popup-buttons"> <button id="survey2-submit">제출</button> <button class="popup-close">닫기</button> </div> </div>  <div id="survey3-popup" class="popup"> <p>당신이 가장 최근에 꿈에서 본 것은?</p> <input type="text" id="recent-dream" placeholder="예: 강아지, 우주, 물고기"> <div class="popup-buttons"> <button id="survey3-submit">제출</button> <button class="popup-close">닫기</button> </div> </div>