간만의 Smooth Zoom 업데이트입니다. 아쉽게도 아직 마음에 드는 빌더는 못 찾았네요. 언제까지 수동으로 빌드해야 할지 의문입니다… 다양한 Argument // HTMLElement || HTMLElement[] Zoom(document.querySelector(".zoomable")); Zoom([ document.querySelector(".foo"), ...document.querySelectorAll(".zoomable"), ]); // NodeList Zoom(document.querySelectorAll(".zoomable")); 기존엔 CSS 선택자만 문자열로 넘길 수 있었는데, 이젠 HTMLElement, HTMLElement[], NodeList 모두 넘길 수 있습니다.Method를 사용할 목적으로 만들 땐 아무것도 넘기지 않으셔도 문제가 생기지 않게도...
사실 저의 생존 여부쯤은 Github에서도 확인할 수 있고, 이 서버가 가동되고 있단 것 자체가 제 생이 유지되고 있음의 방증이긴 합니다만 너무 오래도록 글을 쓰지 않아 이러다 블로그에 글을 쓰는 방법을 잊어버리는 게 아닐까 염려되어 오랜만에 '새 글 추가' 페이지에서 글을 써내려 봅니다.잡담 카테고리엔 장장 10개월 만에 새 글을 추가하네요. 글이 뜸했던 이유는 잔디밭에서도 확인할 수...
개인적인 사정으로 오래 글을 못 쓰고 있었네요.블로그에 신경을 크게 못 쓰고 있다 보니 자연스럽게 푸시 알림 서버에 생긴 문제도 파악을 못 하고 있었습니다. 개인적인 불찰로 구독하신 정보를 저장한 db가 초기화되어, 좌측 하단의 종이 활성화되어있어도 취소하고 다시 구독하시기 전까진 알림이 가지 않습니다.불편을 끼쳐 드려 거듭 죄송합니다.
벌써 2021년도 봄을 맞았습니다.
![[CSS, JS] 노트, 원고지 만들기](https://marshall-ku.com/wp-content/uploads/2021/03/노트-원고지-만들기-400x400.png)
CSS와 자바스크립트로 노트와 원고지에 글을 쓰는 느낌을 주는 방법
grid-template-rows: masonry란 스펙이 작년에 추가되어 이제 자바스크립트 한 줄 없이도 Masonry 레이아웃을 구현할 수 있는 시대가 오긴 했지만, 크롬 최신 버전에서도 layout.css.grid-template-masonry-value.enabled를 활성화해야 작동할 정도로 브라우저 지원율이 처참한 수준입니다. 모든 요소의 position을 absolute로 준 뒤 JS에서 위치 지정 (CSS + JS) (세로로 요소가 정렬되어도 상관없다면) Flex box 등으로 레이아웃 지정 (CSS) grid-auto-rows와 grid-row-end를 활용해 레이아웃...
여전히 미숙한 디자인이지만 나름대로 열심히 만들어봤습니다.중간에 여러 번 갈아엎고 간신히 완성했네요. 시각 디자인을 배워야 하나 깊은 고민에 빠지게 합니다. 아마 내일부턴 검색을 통해 찾거나 직접 주소를 쳐서 들어오지 않는 이상은 볼 수 없는 글이 될 겁니다. 210317 수정 : 숨기는 게 더 힘들어서 그냥 노출합니다…
메인 헤더 디자인 헤더의 배경에 추가되는 특성 이미지(썸네일)의 역할은 단지 제목에 적당한 시각적 즐거움을 주기 위함인데, Parallax 효과에 간혹 색이 강렬한 이미지도 쓰다 보니 본연의 역할을 하지 않고 오히려 본인이 더 돋보일 때도 있는 것 같아 그래디언트를 하나 추가하고 Parallax 효과를 제거해 이미지가 돋보이지 않게 업데이트했습니다. 제목을 제외한 텍스트들의 색상을 더 어둡게 변경했습니다. 댓글 애니메이션...
어제 23시에 도착했는데, 서버 세팅하기엔 최적의 시간이 다가오는 중이라 모조리 하고 잘 생각이었습니다. 멀티 탭이 없단 사실을 깨닫기 전까지는요.점검 중이란 페이지를 띄워두고 왔으면 어떻게라도 멀티 탭을 구했겠지만, 어제 낮에 서버의 webroot 폴더, db 등을 모조리 안 쓰는 랩탑에 복제해두고 그 랩탑을 서버로 돌려두고 있어서 원래 쓰던 서버와 속도, 성능 등을 제외하면 똑같은 수준이기에 그냥 가벼운...
