이미지, 글자 깜빡이는 효과 (자연스러운) https://pikabu.tistory.com/77 [CSS] HTML 태그 글자나 이미지에 깜빡이는 효과 주기 먼저 아래 css 코드를 css파일에 적어 불러오거나 또는 html 파일에 직접 적어 줍니다. html에 css 적용 방법 보기 //CSS .blinking{ -webkit-animation:blink 1.5s ease-in-out infinite alternate; -moz-animati.. pikabu.tistory.com 작업 소스들 2022.05.20
HTML 및 CSS를 사용하여 단 10 분 만에 배경 비디오로 웹 사이트를 만드는 방법 https://designup3.tistory.com/256?category=863610 HTML 및 CSS를 사용하여 단 10 분 만에 배경 비디오로 웹 사이트를 만드는 방법 홈페이지 배경에 동영상을 깔아주는 소스 영상입니다. 영상을 제어해주는 버튼기능은 자바스크립트를 활용하여 구현됩니다. 자막지원이 안되긴 하지만 강사분이 인도분이신지 영어 발 designup3.tistory.com 작업 소스들 2022.05.04
스크립트 없이 HTML과 CSS로만 만드는 슬라이드효과 https://blog.naver.com/co-nam/222084570760 스크립트 없이 HTML과 CSS로만 만드는 슬라이드효과 /*코딩*/ [HTML+CSS{ 코남} ] #HTML #CSS #INPUT #LABEL #웹 #비쥬얼 #아트 #코딩 #코남 #코딩하는남자 #슬라이드효과 ... blog.naver.com 작업 소스들 2022.05.04
흐르는 주가 전광판 스타일의 무한 롤링 배너 만들기 https://blogpack.tistory.com/1120 흐르는 주가 전광판 스타일의 무한 롤링 배너 만들기 고정된 크기를 가지는 이미지들을 전환하는 이미지 슬라이드 배너를 제외하고, 많은 웹사이트에서 가장 사용하는 배너 방식이 텍스트 롤링 배너입니다. 여러 개의 텍스트 내용 행, 또는 아이템 blogpack.tistory.com 작업 소스들 2022.05.04
CSS width height 같게 반응형 정사각형 만드는 방법 https://webruden.tistory.com/465 CSS width height 같게 반응형 정사각형 만드는 방법 (CSS width height same) CSS 작업을 하다보면 너비값(width)은 가변으로 설정이 되지만, 높이값(height)은 가변으로 설정이 되지 않아서 고민을 해본 경험이 있을 것입니다. 이번 포스팅에서는 너비값 기준으로 높이값도 동 webruden.tistory.com width: 100%; padding-bottom: 56%; 작업 소스들 2022.03.06
특정 DIV 위치 자동 갱신 소스 사이드바 div 에 id 를 ar_1 등 유지보수 하기 쉽게 작성 해놓은 다음 최하단에 작성해 주시면 3000ms 즉 3초마다 해당 div 만 리프레시 됩니다! 최근 댓글이나 최근 글 현재 방문자 현황 등등에 유용할것으로 판단됩니다! 작업 소스들 2022.02.21
로딩화면 만들기 / 글 로딩 시 로딩창 띄우기 https://crazykim2.tistory.com/519 [티스토리] 로딩화면 만들기 / 글 로딩 시 로딩창 띄우기 안녕하세요 블로그에서 글을 읽을 때 이미지가 많은 경우 이미지가 출력이 되지 않은 상태로 계속해서 글들을 확인할 수 있습니다 그러면 블로그에 쓴 글이 전부 불러왔는지 알 수가 없는데요 crazykim2.tistory.com 사이에 로딩 화면 코드를 복사해넣습니다 작업 소스들 2021.07.30
크롬 브라우저 이미지 선명하게 하기 css css image-rendering: -webkit-optimize-contrast; transform: translateZ(0); backface-visibility: hidden; 작업 소스들 2021.06.22
IE로 접속할 경우 Edge로 리다이렉트 시키는 간단한 팁 페이스북같은 경우 리뉴얼 이후 모든 색상을 css variables로 대체하고 있는데요. css variables는 대표적으로 ie에서 지원되지 않는 기능 중 하나입니다. 페이스북이 IE를 어떤 식으로 대응했을까 궁금해서 IE로 접속해봤는데 Edge로 리다이렉트되더라구요. 방법은 굉장히 간단합니다. 위 코드를 레이아웃 상단에 삽입하세요. IE로 접속할 경우 엣지를 통해 사이트에 접속합니다. setTimeout 함수 안에 있는 코드는 엣지로 넘어간 이후에 남아있는 IE에서는 다른 페이지를 보여주기 위해 추가된 코드입니다. 해당 링크로 접속해보면 '연결하려는 웹 사이트가 Internet Explorer에서 작동하지 않습니다.' 라는 문구가 쓰여진 페이지가 나오는걸 확인할 수 있습니다. 출처: https://.. 작업 소스들 2021.01.06