기록장

시험은 아주 잘 치고 온것같습니다후기는 아주 간략하게 정리하여 적겠습니당! 📌시험장소대구 계명대학교  (6실의 1번자리 였습니다)  📌사용프로그램  (일러스트라던가 다른것도 많았습니다만 굳이 안써도 될 난이도)포토샵,VScode * 적지 않은 분들이 emmet 기능이 없을까봐.. 자동완성이 안될까봐.. !tab 눌렀을때 나오는 기본폼들을 외워가시던데 제가 친 장소에서는 모두 잘 동작했네요! 📌 시험문제 주제 철길마을 *공개문제와 똑같이! 나왔습니다  📌시험진행 과정1. 8시 30분(시험 시작시간)에 입실가능2. 좌석번호 뽑기 (비번호 폴더명이 이렇게 정해집니다)3. 휴대폰 및 워치등의 전자기기 반납 (PASS로 신분증인증 할 분들은 이 과정에서 인증)4. 시험문제 배부 후, 설명듣기5. 9시쯤에 ..

ul>li.c$*5{dd$}이렇게 입력하면  dd1 dd2 dd3 dd4 dd5 이렇게 숫자가 증가된 상태로 요소를 만들 수 있음

| 방법ifream 가져올때, 아래의 해상도별 파라미터를 추가함144p: &vq=tiny240p: &vq=small360p: &vq=medium480p: &vq=large720p: &vq=hd7201080p: &vq=hd10801440p: &vq=hd14402160p (4K): &vq=hd2160  | 예시코드*loop나 playlist 파라미터는 개인적으로 넣은 부분이라 무시하셔도 됩니다// &vq=tiny ​

| 문제상황영상이 재생 되기전, 썸네일 이미지를 보여 주고 싶은데, 따로 서버에 이미지를 올리지 않고 스크립트를 쓰지않고 빠르게html과 css로만 가져오려면 어떻게 해야할지 고민중인 상황(원래 모든 영상을 내 자체 서버에 올리려고 했는데 용량이 너무 크고(30분이상의 영상 X 7), 서버가 닫히면 영상을 불러올수없는 상황이 발생하는 등의 이유로 사용을 지향하는편)   | 방법 | 전체 코드  위 처럼 일반적으로 유튜브 영상 불러오는 iframe 위에 썸네일을 불러오는 아래의해결코드 (이미지 주소)를 넣고css로..

| 문제상황click이벤트를 사용한 반응형 웹페이지 제작시데스크탑에서는 정상작동하지만 갤럭시 폰에서 특정버튼에 터치이벤트가 걸리지 않음= > click touchend 를 줬더니 대부분 동자갛나, 몇개의 터치 이벤트 동작이 안됨 | 문제의 코드 $(document).ready(function () { $(".drag_box_inner_btn .box_playlist").on("click touchend ", function () { let img = $(this).find("img"); if (img.hasClass("widget_active_bgm")) { img.re..

| 목표안경 낀 고양이 외의 요소(플레이리스트, 시계, 왼쪽 사이드의 고양이들 등) 들은각 sub/ 의 html 안에서 공통적으로 쓰일 div이며,js의 script 또한 동작해야함    | 방법  1. 공통으로 넣을 div를 가진, html 파일을 만듬 (common_widget.html)⚠️ meta tag 빼고 div 알맹이만 가지는 파일이 돼야함 ⚠️ Insomnia's Room .... 그 외 div요소들 2. 공통으로 넣어질 html (common_widget.html) 파일의 css와 js를 만듬(common.css /sub_common.js)// 아래는 이해를 돕기위한, sub_comm..

| 문제상황안드로이드 폰이나 윈도우에서 의도대로 잘 나오던 높이값이,아이폰에서 (사파리,크롬)보면 자꾸 없어진 상태로 나옴 온갖 방법(flex만 주기, padding, margin, position주기...) 을 다 써본 결과flex + line-height를 주면 해결된다는걸 알게 되어서 기록...player_info { position: absolute; top: 24%!important; left: 50%; transform: translateX(-50%); width: 80%; display: flex; flex-wrap: wrap; flex-direction: column; justify-content: flex-start; /* line-h..

| 문제상황제이쿼리 기본 draggable 메서드를 사용해서 화면내에서 드레그로오브젝트를 이동시키는 환경에서오브젝트를 html바깥쪽으로 이동하면 그만큼 가로세로축이 늘어나는 상황..    $(document).ready(function () { // 드래그 가능한 요소 생성 $(".draggable_clock, .draggable_bgm").draggable({ touchAction: "auto", // 터치 이벤트 활성화 grid: [10, 10], containment: 'main'// 드레그 영역 제한 }); ..

| 문제상황index.html과 sub/subpage.html 은 같은 JS를 공유해서 사용하는 상황.같은 mp3파일을 JS를 통해 가져와야 하는데,경로가 달라서 JS가 sub/subpage.html 에서 동작할경우'. ./ '가 추가되어야 함 $(document).ready(function () { const basePath = window.location.pathname.includes('/sub/') ? '../' : ''; const audioPaths = { Bgm1_Fireplace: basePath + 'bgm/DC_fire.mp3', Bgm2_Rain: basePath + 'bgm/DC_rain.mp3', Bgm3_MxRedKeyboard: ..

/* 모든 요소에 대해 하이라이트 제거 */* { -webkit-user-select: none!important; /* 크롬, 사파리, 오페라 */ -moz-user-select: none!important; /* 파이어폭스 */ -ms-user-select: none!important; /* 인터넷 익스플로러/엣지 */ -webkit-tap-highlight-color: rgba(0, 0, 0, 0); /* Safari */ -webkit-tap-highlight-color: transparent; /* 다른 웹킷 기반 브라우저 */ user-select: none!important; /* 표준 */}    -webkit-tap-highlig..