# sticky

3개의 포스트

모바일 Safari에서 레이어의 부분적 렌더링 오류 해결

모바일 Safari에서 sticky 내비게이션을 구현할 때나 position: fixed를 선언하여 레이어를 만들 때, 해당 레이어가 부분적으로 렌더링이 되지 않아 뚫려보이는 오류가 발생한다. 오류를 해결하기 위해서는 아래 css를 추가하고, 탭 이벤트시 이벤트 방지를 선언해 주어야 한다. css js

2019년 8월 14일
·
0개의 댓글

sticky 내비게이션 만들기

sticky 내비게이션은 스크롤시 페이지 상단에 고정되는 내비게이션이다. css의 postition:sticky 속성을 이용해 간단히 해당 내비게이션을 만들 수 있다. IE는 지원하지 않으며, Edge 16+, Firefox 32+, Chrome 56+ 지원한다.

2019년 8월 13일
·
0개의 댓글

CSS(만으)로 스티키 헤더에 그림자 넣기

(물론 이런저런 CSS 프레임워크를 쓰면 그냥 해결될 문제이지만) 아래와 같은 효과를 구현해야 할 경우, c770d402-f4bb-4567-91c6-3e304d27df0a.gif 보통 clientHeight과 scrollHeight등으로 높이를 계산한다던가 좀 더 스마트하게 Intersection Observer를 사용한다던지 하는 자바스크립트로 해결을...

2019년 3월 3일
·
0개의 댓글