사이드 맨 아래에 위치한 엘리먼트 스크롤시 상단에 도착하면 고정

댓글 6

• prologos

  2019.12.21 03:19
  원하시는건지 모르겠지만 한번 살펴보세요.
  https://www.w3schools.com/howto/howto_css_sticky_element.asp
  좋아요 0
• 웹지기

  2019.12.21 03:36
  @prologos

  방금 링크 페이지 방문해서 시연을 보니 제가 원하는게 맞는 것 같습니다. 살펴보겠습니다. 감사합니다.
  좋아요 0
• 웹지기

  2019.12.21 05:47
  css Sticky 속성으로는 구현이 잘 안되서
  기존에 레이아웃에서 제공하는 사이드바 영역 고정 기능을 수정해서 사이드바 중에서 광고쪽만 고정되게 고쳐서 수정했네요.
  좋아요 0
• 

  윤삼

  2019.12.21 08:38
  @웹지기

  sticky가 그렇게 쓰이는 거였군요. 저도 처음 알게 됐어요ㅎㅎ
  궁금해서 찾아봤는데 스크롤되는 영역과 sticky되는 요소 사이에 overflow 속성이 끼어 있는 게 있으면 그냥 relative로 인식한다더군요.
  좋아요 0
• 웹지기

  2019.12.21 09:31
  @윤삼

  결국 잘안되서 레이아웃에 잘만들어진 사이드 고정기능에서 fixed 할 영역 과 위 가변 엘리먼트 2개 지나 고정시킬 엘리먼트 바로 위에 위치값 확인할 더미 엘리먼트 추가해서 완성했네요.
  결과적으로는 더 잘되었습니다. 브라우저에 따라 sticky는 안될 수 있거든요.
  좋아요 0
• 민우

  2019.12.21 07:32
  웹지기님도 PHP 7.2이었군요.^^
  좋아요 0