Video with Inertia<\/title>\n <meta name=\"viewport\" content=\"width=device-width, initial-scale=1.0, user-scalable=no\" \/>\n <script src=\"https:\/\/aframe.io\/releases\/1.2.0\/aframe.min.js\"><\/script>\n <style>\n :root {\n --line-color: #ffffff;\n --hover-bg: rgba(255, 255, 255, 0.15);\n --tooltip-bg: #ffffff;\n --tooltip-text: #000000;\n }\n\n video {\n position: fixed;\n top: 0;\n left: 0;\n width: 100vw;\n height: 100vh;\n object-fit: cover;\n z-index: 0;\n }\n\n .bottom-container {\n position: fixed;\n bottom: 0px;\n left: 50%;\n transform: translateX(-50%);\n width: 100%;\n max-width: 800px;\n border: 1px solid var(--line-color);\n display: flex;\n align-items: center;\n background: rgba(255, 255, 255, 0.1);\n padding: 0;\n backdrop-filter: blur(7px);\n z-index: 1000;\n }\n .info, .audio-control {\n display: flex;\n align-items: center;\n justify-content: center;\n padding: 10px;\n font-size: 16px;\n font-weight: bold;\n color: white;\n cursor: pointer;\n transition: all 0.3s ease;\n flex-grow: 1;\n }\n .divider {\n width: 1px;\n height: 50px;\n background: var(--line-color);\n }\n .info:hover, .audio-control:hover {\n background: var(--hover-bg);\n }\n .info svg, .audio-control svg {\n margin-right: 6px;\n width: 20px;\n height: 20px;\n }\n .audio-control .icon-off { display: none; }\n .audio-control.muted .icon-on { display: none; }\n .audio-control.muted .icon-off { display: block; }\n <\/style>\n<\/head>\n<body>\n <video id=\"myVideo\" src=\"https:\/\/vc.cau.ac.kr\/attractivelaos\/wp-content\/uploads\/sites\/4\/2025\/02\/youtube_i-4vcpnxj9Q_1920x1080_h264.mp4\" muted autoplay playsinline\n preload=\"auto\"><\/video>\n\n <div class=\"bottom-container\">\n <div class=\"info\" onclick=\"window.location.href='https:\/\/vc.cau.ac.kr\/attractivelaos\/';\">\n <svg xmlns=\"http:\/\/www.w3.org\/2000\/svg\" viewBox=\"0 0 24 24\" fill=\"white\">\n <path d=\"M5 3l14 9-14 9V3z\" \/>\n <\/svg>\n Skip\n <\/div>\n <div class=\"divider\"><\/div>\n <div class=\"audio-control\" id=\"sound-mute\">\n <svg class=\"icon-on\" xmlns=\"http:\/\/www.w3.org\/2000\/svg\" viewBox=\"0 0 24 24\" fill=\"white\">\n <path d=\"M10 4 6 8H3v8h3l4 4V4z\" \/>\n <path d=\"M15 8.5a1 1 0 0 0-1.5 1.4 4 4 0 0 1 0 4.2 1 1 0 1 0 1.5 1.4 6 6 0 0 0 0-7z\" \/>\n <\/svg>\n <svg class=\"icon-off\" xmlns=\"http:\/\/www.w3.org\/2000\/svg\" viewBox=\"0 0 24 24\" fill=\"white\">\n <path d=\"M6 18l12-12\" stroke=\"white\" stroke-width=\"2\" stroke-linecap=\"round\" \/>\n <\/svg>\n Sound\n <\/div>\n <\/div>\n\n <script>\n const videoEl = document.getElementById('myVideo');\n const soundMuteBtn = document.getElementById('sound-mute');\n\n soundMuteBtn.addEventListener('click', () => {\n videoEl.muted = !videoEl.muted;\n soundMuteBtn.classList.toggle('muted', videoEl.muted);\n });\n\n document.addEventListener('DOMContentLoaded', () => {\n soundMuteBtn.classList.add('muted');\n videoEl.play().catch(() => {});\n });\n\n videoEl.addEventListener('ended', () => {\n window.location.href = 'https:\/\/vc.cau.ac.kr\/attractivelaos\/';\n });\n <\/script>\n<\/body>\n<\/html>\n","protected":false},"excerpt":{"rendered":"<p>Video with Inertia Skip Sound<\/p>\n","protected":false},"author":2,"featured_media":0,"parent":0,"menu_order":0,"comment_status":"closed","ping_status":"closed","template":"","meta":{"footnotes":""},"class_list":["post-1767","page","type-page","status-publish","hentry"],"_links":{"self":[{"href":"https:\/\/vc.cau.ac.kr\/attractivelaos\/wp-json\/wp\/v2\/pages\/1767","targetHints":{"allow":["GET"]}}],"collection":[{"href":"https:\/\/vc.cau.ac.kr\/attractivelaos\/wp-json\/wp\/v2\/pages"}],"about":[{"href":"https:\/\/vc.cau.ac.kr\/attractivelaos\/wp-json\/wp\/v2\/types\/page"}],"author":[{"embeddable":true,"href":"https:\/\/vc.cau.ac.kr\/attractivelaos\/wp-json\/wp\/v2\/users\/2"}],"replies":[{"embeddable":true,"href":"https:\/\/vc.cau.ac.kr\/attractivelaos\/wp-json\/wp\/v2\/comments?post=1767"}],"version-history":[{"count":2,"href":"https:\/\/vc.cau.ac.kr\/attractivelaos\/wp-json\/wp\/v2\/pages\/1767\/revisions"}],"predecessor-version":[{"id":1775,"href":"https:\/\/vc.cau.ac.kr\/attractivelaos\/wp-json\/wp\/v2\/pages\/1767\/revisions\/1775"}],"wp:attachment":[{"href":"https:\/\/vc.cau.ac.kr\/attractivelaos\/wp-json\/wp\/v2\/media?parent=1767"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}

{"id":1767,"date":"2025-02-25T11:34:46","date_gmt":"2025-02-25T11:34:46","guid":{"rendered":"https:\/\/vc.cau.ac.kr\/attractivelaos\/?page_id=1767"},"modified":"2025-02-25T11:42:04","modified_gmt":"2025-02-25T11:42:04","slug":"introduction","status":"publish","type":"page","link":"https:\/\/vc.cau.ac.kr\/attractivelaos\/introduction\/","title":{"rendered":"Introduction"},"content":{"rendered":"\n\n\n\n \n Video with Inertia<\/title>\n <meta name=\"viewport\" content=\"width=device-width, initial-scale=1.0, user-scalable=no\" \/>\n <script src=\"https:\/\/aframe.io\/releases\/1.2.0\/aframe.min.js\"><\/script>\n <style>\n :root {\n --line-color: #ffffff;\n --hover-bg: rgba(255, 255, 255, 0.15);\n --tooltip-bg: #ffffff;\n --tooltip-text: #000000;\n }\n\n video {\n position: fixed;\n top: 0;\n left: 0;\n width: 100vw;\n height: 100vh;\n object-fit: cover;\n z-index: 0;\n }\n\n .bottom-container {\n position: fixed;\n bottom: 0px;\n left: 50%;\n transform: translateX(-50%);\n width: 100%;\n max-width: 800px;\n border: 1px solid var(--line-color);\n display: flex;\n align-items: center;\n background: rgba(255, 255, 255, 0.1);\n padding: 0;\n backdrop-filter: blur(7px);\n z-index: 1000;\n }\n .info, .audio-control {\n display: flex;\n align-items: center;\n justify-content: center;\n padding: 10px;\n font-size: 16px;\n font-weight: bold;\n color: white;\n cursor: pointer;\n transition: all 0.3s ease;\n flex-grow: 1;\n }\n .divider {\n width: 1px;\n height: 50px;\n background: var(--line-color);\n }\n .info:hover, .audio-control:hover {\n background: var(--hover-bg);\n }\n .info svg, .audio-control svg {\n margin-right: 6px;\n width: 20px;\n height: 20px;\n }\n .audio-control .icon-off { display: none; }\n .audio-control.muted .icon-on { display: none; }\n .audio-control.muted .icon-off { display: block; }\n <\/style>\n<\/head>\n<body>\n <video id=\"myVideo\" src=\"https:\/\/vc.cau.ac.kr\/attractivelaos\/wp-content\/uploads\/sites\/4\/2025\/02\/youtube_i-4vcpnxj9Q_1920x1080_h264.mp4\" muted autoplay playsinline\n preload=\"auto\"><\/video>\n\n <div class=\"bottom-container\">\n <div class=\"info\" onclick=\"window.location.href='https:\/\/vc.cau.ac.kr\/attractivelaos\/';\">\n <svg xmlns=\"http:\/\/www.w3.org\/2000\/svg\" viewBox=\"0 0 24 24\" fill=\"white\">\n <path d=\"M5 3l14 9-14 9V3z\" \/>\n <\/svg>\n Skip\n <\/div>\n <div class=\"divider\"><\/div>\n <div class=\"audio-control\" id=\"sound-mute\">\n <svg class=\"icon-on\" xmlns=\"http:\/\/www.w3.org\/2000\/svg\" viewBox=\"0 0 24 24\" fill=\"white\">\n <path d=\"M10 4 6 8H3v8h3l4 4V4z\" \/>\n <path d=\"M15 8.5a1 1 0 0 0-1.5 1.4 4 4 0 0 1 0 4.2 1 1 0 1 0 1.5 1.4 6 6 0 0 0 0-7z\" \/>\n <\/svg>\n <svg class=\"icon-off\" xmlns=\"http:\/\/www.w3.org\/2000\/svg\" viewBox=\"0 0 24 24\" fill=\"white\">\n <path d=\"M6 18l12-12\" stroke=\"white\" stroke-width=\"2\" stroke-linecap=\"round\" \/>\n <\/svg>\n Sound\n <\/div>\n <\/div>\n\n <script>\n const videoEl = document.getElementById('myVideo');\n const soundMuteBtn = document.getElementById('sound-mute');\n\n soundMuteBtn.addEventListener('click', () => {\n videoEl.muted = !videoEl.muted;\n soundMuteBtn.classList.toggle('muted', videoEl.muted);\n });\n\n document.addEventListener('DOMContentLoaded', () => {\n soundMuteBtn.classList.add('muted');\n videoEl.play().catch(() => {});\n });\n\n videoEl.addEventListener('ended', () => {\n window.location.href = 'https:\/\/vc.cau.ac.kr\/attractivelaos\/';\n });\n <\/script>\n<\/body>\n<\/html>\n","protected":false},"excerpt":{"rendered":"<p>Video with Inertia Skip Sound<\/p>\n","protected":false},"author":2,"featured_media":0,"parent":0,"menu_order":0,"comment_status":"closed","ping_status":"closed","template":"","meta":{"footnotes":""},"class_list":["post-1767","page","type-page","status-publish","hentry"],"_links":{"self":[{"href":"https:\/\/vc.cau.ac.kr\/attractivelaos\/wp-json\/wp\/v2\/pages\/1767","targetHints":{"allow":["GET"]}}],"collection":[{"href":"https:\/\/vc.cau.ac.kr\/attractivelaos\/wp-json\/wp\/v2\/pages"}],"about":[{"href":"https:\/\/vc.cau.ac.kr\/attractivelaos\/wp-json\/wp\/v2\/types\/page"}],"author":[{"embeddable":true,"href":"https:\/\/vc.cau.ac.kr\/attractivelaos\/wp-json\/wp\/v2\/users\/2"}],"replies":[{"embeddable":true,"href":"https:\/\/vc.cau.ac.kr\/attractivelaos\/wp-json\/wp\/v2\/comments?post=1767"}],"version-history":[{"count":2,"href":"https:\/\/vc.cau.ac.kr\/attractivelaos\/wp-json\/wp\/v2\/pages\/1767\/revisions"}],"predecessor-version":[{"id":1775,"href":"https:\/\/vc.cau.ac.kr\/attractivelaos\/wp-json\/wp\/v2\/pages\/1767\/revisions\/1775"}],"wp:attachment":[{"href":"https:\/\/vc.cau.ac.kr\/attractivelaos\/wp-json\/wp\/v2\/media?parent=1767"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}