![[트게더 커스텀 CSS] 밤게더](https://wp.marshallku.com/wp-content/uploads/2019/12/밤게더-1-400x225.jpg)
트위치 스트리머 _밤새 님의 트게더입니다. 트게더 둘러보니 배경에 뭔가 떨어지게 하는 게 유행이더라고요.별이 배경에 떨어지는 걸 원하셔서 남들은 어떻게 해뒀나 보니 죄다 background-position을 움직이는 애니메이션을 이용했더라고요. 1초에 수십 번씩 repaint하는 건 좀 아닌 것 같아 예전과 마찬가지로 ::before, ::after 두 pseudo element를 활용해 transform: translate()을 이용해 별이 떨어지게 해뒀습니다.깔끔한 애니메이션을 위해 화면 크기의 4배가 되는...
사진 중심의 블로그를 꾸미시는 분들을 위한 스킨입니다.다양한 썸네일 중심의 기능과, 이미지를 편하게 볼 수 있는 기능들을 제공합니다. 라이브 데모 주요 기능다운로드상세 설명 주요 기능 - Lazy Load : 화면 밖에 있는 이미지의 로딩을 지연해 훨씬 빠른 블로그 제작 가능- 이미지 갤러리 : 본문의 이미지를 한 번에 모아볼 수 있도록 해주는 기능- 이미지 크게 보기 :...
Github카메라 앱 링크 트와이스의 일본 앨범 "&TWICE"의 발매를 맞아 진행하는 [&TWICE Web 카메라 컨텐츠]란 이벤트를 보고 제작하게 됐습니다. 그냥 트와이스 멤버가 들어간 액자(프레임)가 있고, 본인이 찍은 사진을 그 안에 집어넣어서 사진을 만드는 단순한 이벤튼데, Web 카메라라면서 찍어둔 사진만 업로드가 가능하길래, HTML5 Canvas 공부도 할 겸 실제로 카메라를 쓰는 앱을 만들어 봤습니다. 굉장히 단순한 앱입니다. 화면...
Home 홈 화면입니다. 첫 화면엔 유튜브 영상이, 아래로 내리면 Carousel Slider와 최근 뉴스 목록 등이 나오도록 했습니다. About Parallax Scroll을 이용해 소개 페이지를 제작했습니다. Artist News Album 커스텀 포스트 타입을 이용해, 외부 링크로 연결할 수 있도록 했습니다.해당 페이지로 억지로 접속하면 404 에러를 반환합니다.
크롬 확장 프로그램으로 제작한 TWICE New Tab을 싱글 페이지 앱으로 옮겼습니다. 앱 링크 외관은 크롬 확장 프로그램 버전과 크게 다르지 않습니다.크롬 외의 브라우저에서 해당 페이지를 홈페이지로 설정하면 크롬 확장 프로그램과 똑같이 사용하실 수 있습니다. 당연히 모바일도 지원합니다. 기본적으로 새 탭을 꾸미기 위해 만든 앱입니다.밋밋한 새 탭을 트와이스, 할 일 목록, 날씨 등으로 채울 수 있습니다....
![[트게더 커스텀 CSS] 뽀게더](https://wp.marshallku.com/wp-content/uploads/2019/12/뽀게더1-400x225.jpg)
트위치 스트리머 아구이뽀 님의 트게더입니다. 트게더 스킨은 처음 작업해보는데, 자바스크립트는 그렇다 치더라도 HTML도 건드릴 수가 없더라고요.웹 표준과 조금 거리가 있는 방식이지만 ::after, ::before 두 pseudo element를 십분 활용해서 만들었습니다. 먼저, 파스텔톤 밤하늘의 배경을 원하셔서, 보랏빛 밤하늘에 파스텔톤 달과 흰 별을 띄웠습니다.달에는 천천히 위아래로 움직이는 애니메이션, 뒤에 별은 깜빡이는 애니메이션을 추가했습니다.자바스크립트가 가능했다면 랜덤 위치에 별을 뿌려줬겠지만,...
깃허브 제작기 링크 소개 HTML5 Canvs를 이용해서 간단하게 썸네일, 배너 등에 쓸 수 있는 이미지를 제작할 수 있는 앱입니다. 이미지의 크기 조정, 텍스트 수정, 배경 색 및 글자 색 변경, 배경에 이미지 추가, 해당 이미지의 투명도 조절 등의 기능이 포함되어 있습니다. 포토샵 등의 도구보다 자유도는 떨어지지만, 배너나 썸네일을 만들기는 훨씬 수월합니다. 사용법 크기 조정 Canvas의...
티스토리 블로거 Kiss Me 님의 스킨입니다. 커버 화면의 모습입니다. 썸네일을 작게 4개씩 보여주는 리스트 썸네일을 1:1 비로 보여주는 리스트 배경에 썸네일이 들어간 리스트 갤러리형 리스트 총 4가지로 구성되어 있습니다. 좌측 드로워엔 관리자 프로필 구독, 이웃 추가, RSS 링크 링크 목록 방문자 수 티스토리 메뉴바 로 구성되어 있고 우측 드로워엔 홈, 방명록, 공지사항 바로 가기 카테고리...
스킨 구매는 이곳에서 하실 수 있습니다. 5번 스킨인 Summer Nights와 비슷한 느낌으로 새로 만든 스킨입니다. 티스토리에서 추가한 커버 기능을 이용해 홈 화면을 다양하게 꾸밀 수 있도록 하고, 헤더 카테고리를 중앙 정렬시키는 등 다양한 개선이 이뤄진 버전입니다. 포스트 화면의 모습입니다.글에 집중할 수 있도록 1, 2단형 선택을 없애고 1단형으로 고정했습니다. 예전엔 글 목록을 표시할 때 Masonry 하나만...