특정 구간에서 반복적으로 재생되어야 하는 유튜브 영상 삽입하기 iframe으로 삽입하고 loop를 넣었더니특정 구간 재생 시작 => 특정 구간 재생 종료까지는 되는데종료 시점에서 영상이 끝나면 아예 영상 맨처음부터 다시 재생이 됐다 구글링을 통해특정 구간을 반복 재생하려면 유튜브 api를 사용해야 한다는 것을 찾아서 문제 해결 // youtube loop play var tag = document.createElement('script'); tag.src = "https://www.youtube.com/iframe_api"; var firstScriptTag = document.getElementsByTagName('script')[0]; firstScriptTag.parentNode.insert..
HTML CSS/* .active 클래스명 주고 애니메이션 스타일링, 아래는 예시 */.item_01.active .item_btm .con_wrap:before{ animation: triangleChartArrow 0.5s 1.5s linear forwards;}.item_01.active .chart_wrap:before{ animation: triangleChart 1s 0.5s linear forwards;}.item_01.active .chart_wrap:after{ animation: triangleChartTxt 1.5s 2s linear infinite; opacity: 1; -webkit-transition: opacity 0.5s 2s; trans..
HTML go to section 1 go to section 2 CSS/* navigation */.navi_wrap{ position: relative; z-index: 10; height: 97px;}.navi_wrap.fixed .navi_menu{ position: fixed; top: 0; left: 50%; -webkit-transform: translateX(-50%); transform: translateX(-50%); width: 1200px;}.navi_menu{ display..
HTML 모달 띄우기 모달 팝업 콘텐츠 CSS/* modal */body.ofh { overflow-y: hidden;}#dim { display: none; position: fixed; top: 0; left: 0; z-index: 10001; width: 100%; height: 100%; background-color: rgba(0, 0, 0, 0.6);}.modal_contents { display: none; position: fixed; top: 50%; left: 50%; -webkit-transform: translate(-50%, -50%); transform: translate(-50%, -50%); z-index: 10002; width: 9..
let prevScrollpose = window.pageYOffset; window.addEventListener("scroll", function() { let currentScrollPose = window.pageYOffset; if (prevScrollpose > currentScrollPose) { document.getElementById("bnr_btm").style.bottom = "60px"; // 스크롤 올릴 때 } else { document.getElementById("bnr_btm").style.bottom = "0px"; // 스크롤 내릴 때 } prevScrollpose = currentScrollPose; });}
swiper 플러그인을 탭에 삽입했는데탭이 바뀌면 스와이퍼가 작동하지 않는 이슈 발생 구글링하여 아래 코드로 해결 ! // swiper for auto play on tab menudocument.addEventListener('DOMContentLoaded', function () { let tabSliders = document.querySelectorAll('.my_swiper'); tabSliders.forEach(function (slider, index) { let sliderId = index + 1; let mySwiper = new Swiper(slider, { observer: true, observeParents: true, slidesPerView: 1, spaceBetwee..
html css#snow_wrap{ position: absolute; top: 0; left: 0; width: 1920px; height: 100%;}#snow_wrap canvas{ position: absolute; top: 0; left: 50%; -webkit-transform: translateX(-50%); transform: translateX(-50%);} js// snow animation$(()=>{ (function () { var requestAnimationFrame = window.requestAnimationFrame || window.mozRequestAnimationFrame || window.webkitRequestAnimationFrame || window...