loading
마우스를 올려 gif를 재생하기
블로그 & 스킨/How to
마우스를 올려 gif를 재생하기

gif의 프레임을 잘라서 멈춰있는 이미지를 만들 땐 ezgif를 이용하시면 됩니다. CSS만 이용하기 HTML1234<span class="hov-anim-box">  <img src="https://t1.daumcdn.net/cfile/tistory/996B5C3F5C2DCE5304?original" alt="" ..

티스토리 모바일 경로(/m)에서 강제로 원래 경로로 리다이렉트
블로그 & 스킨/How to
티스토리 모바일 경로(/m)에서 강제로 원래 경로로 리다이렉트

들어가기에 앞서, 적용이 꽤 귀찮은 스크립트라 블로그 모든 글에 적용하기보다 특정 글들에만 사용하는 게 좋지 않을까 생각합니다. 모바일 페이지를 사용하지 않는다고 설정해둬도 페이지 생성 자체가 막히는 게 아니라서, 접근은 잘만 됩니다. 네이버 블로그는 구글에 검색하면 모바일 페이지로 노출되는 것도 엄청나게 많던데, 티스토리 블로그는 잘 모르겠네요. 여튼, 블로그에 적용한 스크립트 등 때문에 모바일 화면에서 보면 안 되는 글들에 설정해주면 꽤 ..

유튜브 팝업 레이어 만들기
블로그 & 스킨/How to
유튜브 팝업 레이어 만들기

.popupVideo란 div 아래의 a 태그를 클릭하면 유튜브 비디오를 레이어로 띄워 주면서 영상을 재생합니다. (PC) 화면의 빈 곳을 누르면 팝업 레이어가 사라지면서 유튜브 영상이 정지됩니다. a 태그 안에 들어간 내용은 유튜브 들어가셔서 아무 영상이나 클릭하시면 https://www.youtube.com/watch?v=ZBCGkpJWjVc 같은 형식으로 주소창에 표시될 겁니다. ?v= 뒤의 내용이 비디오의 id입니다. 해당 내용 복사해서..

티스토리 404 페이지에서 메인 화면으로 리다이렉트
블로그 & 스킨/How to
티스토리 404 페이지에서 메인 화면으로 리다이렉트

404 페이지 확인이 글 뒤에 이어서 작성하는 글입니다. 404 페이지를 꾸미는 방법은 여기서 확인해주세요.12345678$(function() {  var b = $(".article_container"),      f = $(".absent_post").length,    &nb..

유튜브 세로 영상 퍼오기
블로그 & 스킨/How to
유튜브 세로 영상 퍼오기

유튜브에 모니터의 사이즈가 아닌 휴대폰의 사이즈에 최적화되어 올라오는 영상의 수는 날이 갈수록 늘고 있습니다. 그런데 아직도 유튜브의 '퍼가기(embed)' 기능은 거의 모든 비디오를 가로 560, 세로 315에 맞춰서 퍼오도록 자동으로 설정합니다. iframe을 조금만 수정하면 세로 비디오로 변경할 수 있습니다. 예시 HTML1<iframe width="360" height="640" src="https://w..

[JS] 요소를 클립보드로 복사하기
블로그 & 스킨/How to
[JS] 요소를 클립보드로 복사하기

자바 스크립트를 이용해 요소를 클립보드로 복사하는 방법입니다.*IE 8 아래로는 작동하지 않습니다.123$(".copy").each(function() {  $(this).append("<input type=\"text\" value=" + $(this).text() + ">")});Colored by Color Scriptercsinput으로 요소를 복사해놔..

[JS] 티스토리 어드민인지 확인하기
블로그 & 스킨/How to
[JS] 티스토리 어드민인지 확인하기

관리 / 글쓰기 등 관리자만 사용하는 메뉴는 굳이 관리자가 아닌 사용자에게 보여줄 필요가 없습니다.그런데도 보통은 관리자만 쓰는 메뉴가 모두에게 보이거나, 로그인 안 한 사용자에게만 보이지 않도록 작업하는 게 대부분이더라고요.12345$(document).ready(function() {  if ($(".tt_add_link[data-alert]").length > 0) { ..

티스토리 이미지 강제로 원본 표시하기
블로그 & 스킨/How to
티스토리 이미지 강제로 원본 표시하기

글쓰기 가로 폭을 설정하면 일괄적으로 글 영역의 이미지 크기가 변경되면 좋겠지만, 애석하게도 그런 기능은 지원하지를 않습니다 ㅠㅠ그래서 그냥 만약 이미지가 컨테이너보다 작으면 원본 이미지로 표시되도록 작업했습니다.이미지가 충분히 큰데도 컨테이너를 꽉 채우지 못하는 게 좀 눈에 거슬려서 작업했는데, 실용성이 그리 높을지는 잘 모르겠네요;;123456789$(".imageblock").each(function() {  var&..

 
 
1 2 3

티스토리 툴바