개발 카테고리 글

[자바스크립트] 렌티큘러 카드 구현하기

보이는 각도에 따라 달라지는 렌티큘러 카드를 자바스크립트로 구현하기

티스토리 모바일 페이지 완벽히 비활성화하기

사진처럼 홈 화면까진 접속되지만, 글을 클릭하는 순간 /m이 사라진 주소로 리다이렉트됩니다. 191215 업데이트 - 티스토리 앱에서도 작동210614 업데이트 - 텐핑 코드 사용하도록 업데이트 기초 작업 먼저, 관리자 페이지에서 꾸미기 모바일로 가셔서 티스토리 모바일웹 자동 연결을 "사용하지 않습니다."로 먼저 변경해주세요. 플러그인 작업 위 작업을 마쳐도 자동으로 리다이렉트되는 것만 막을 뿐이지 접속은 됩니다. 심지어 검색 엔진에 노출도

[자바스크립트] 현재 중심적인 시간 표시하기

23:00" 처럼 표기된 시간을 현재 시각을 기준으로 "13분 전" 처럼 변경하는 스크립트입니다. export const SECOND_TO_MS = 1000; export const MINUTE_TO_SECOND = 60; export const HOUR_TO_SECOND = MINUTE_TO_SECOND * 60; export const DAY_TO_SECOND = HOUR_TO_SECOND * 24; export const WEEK_TO_DAY = 7; export const WEEK_TO_SECOND = WEEK_TO_DAY * DAY_TO_SECOND; // (365.24 / 12).toFixed(2) export const

캐싱 초보의 비애

10월 24일에 적은 제작일지에서 캐시 헤더를 추가했다고 적었는데, 일단 거기서부터 틀렸습니다. 제일 먼저 .htaccess를 수정해 코드를 작성했습니다. 제가 어드민이라 conf 파일을 수정할 수 있음에도요. 더 큰 문제는 서버에 캐시 헤더를 추가하기 위한 모듈이 설치되어 있었지만 저는 그 모듈을 활성화하지 않고 모듈이 활성화돼있으면 캐시 헤더를 설정하는 코드만 추가해뒀고, 당연히 캐싱은 제대로 작동하고 있지 않았습니다. 그제 그

왜 텅 빈 Array는 true인가

자바스크립트가 좀 이상한 구조를 보이는 부분이 많아서 그런지 그냥 사용자가 많아서 그런지 자바스크립트를 까는 밈이 여기저기 많더라고요. this는 꽤 예전엔 진심으로 까는 사람도 많았고, [] == 0이고 "\t" == 0이지만 [] != "\t"인 기묘한 등식([] != []인데 [] == "\t"인게 더 기묘하지 않았을까 싶지만)을 이용한 건 물론이거니와, 자바스크립트의 기묘함을 이용해 []()!+ 만으로 코딩하는 JS**ck까지 꽤

[티스토리] 원하는 태그만 랜덤으로 출력하기

티스토리에서 기본적으로 랜덤 태그 치환자를 제공해줍니다만, 원하는 태그 몇 개 안에서만 랜덤으로 태그를 출력하고 싶으실 때 이 스크립트를 사용하시면 됩니다.

[자바스크립트] 이미지의 우클릭만 방지하기

가끔 웹서핑하다 보면 텍스트를 복사해가라고 해뒀는데, context menu를 막아둬서 모바일에선 복사할 수 없을 때가 있습니다.무분별하게 퍼진 우클릭 방지 스크립트 때문이지 싶은데, 원하시는 게 이미지의 우클릭 방지라면 이미지의 우클릭만 막을 수 있습니다. document.addEventListener("contextmenu", e => { e.target.matches("img") && e.preventDefault() }) 심화 우클릭 방지에서 나아가 위 사진처럼 우클릭을 한 위치에 저작권 문구를 표기하는 커스텀 우클릭 메뉴 (context menu, 이하 컨텍스트 메뉴)를 만드실

[자바스크립트] 한 번만 실행되는 Event Listener

가끔 onclick, onerror 등의 이벤트가 한 번만 실행돼야 할 때가 있습니다. 가령 이미지에 에러가 있을 때 그 이미지를 다른 이미지로 교체하는 함수를 만들었을 때, 교체된 이미지에도 에러가 있다면 여러분은 콘솔에 찍히는 어마어마한 양의 404 에러를 보실 수 있을 겁니다.잡렉은 덤이고요. 다행히도, 위와 비슷한 상황을 예방할 수 있도록 이벤트 리스너가 한 번만 작동하게 할 수 있는 간단한 방법이

[자바스크립트] 스와이프 방향 알아내기

제 블로그에서 드로워를 열거나, 홈 화면 슬라이더를 넘길 때 사용 중인 스와이프 감지 스크립트입니다. 굉장히 단순한 구조지만, 간단한 사용엔 크게 무리가 없습니다.