Home › 게시판 › 커뮤니티 › Q&A › 표를 sticky 로 설정하는 방법

1개 답변, 2 voices Last updated by Avatar of Matthew ParkMatthew Park 4 years, 5 months 전
  • Avatar of moodaengmoodaeng
    Participant
    @moodaeng
    2020/07/18 5:19 오후 #55174

    http://www.hanatourjeju.com/pack/view.php?no=13

    하나투어제주 사이트입니다. 스크롤을 내리면 본문에 있는 예약하기, 포함내역, 불포함사항, 추천상세일정, 기타정보 표가 sticky로 화면 상단에 고정되어있는데요. 이와 같이 만들려고하는데 어떻게 만들 수 있을까요 ㅠㅠ

    현재, 표를 만들고, 각 열마다 원페이지 텍스트링크는 넣었습니다만 sticky 기능을 넣을 방법을 못찾았습니다.(더불어 하나투어사이트에선 텍스트말고 빈공간 눌러도 원페이지에서 스크롤 되는데 저는 텍스트를 정확히 눌러야 스크롤 되네요. 후..) 애초에 table element를 쓴게 잘못된 거일수도 있겠네요 후..  html css 등 코딩은 문외한입니다.. 죄송합니닷.

    참고로 워드프레스 아바다 테마 이용중입니다!

    Avatar of moodaeng
    moodaeng
    Avatar of Matthew ParkMatthew Park
    Moderator
    @hackya
    2020/07/19 3:40 오전 #55175

    js 로는 if scrolled, position: fixed, else

    이런식의 로직으로 하고,

    css 로는

    position: sticky;

    이렇게 한줄이면 됩니다. (한국쪽 크로스브라우징 확인하시구요)

    Avatar of Matthew Park
    Matthew Park
    Attorney, front-end developer, digital media artist, WordPress enthusiast, & a father of 4 wonderful children.

    Lives in Colorado.

  • Author
    Posts
2 글 보임 - 1에서 2 까지 (총 2 중에서)
  • 답변은 로그인 후 가능합니다.