반응형 블로그 수익화/블로그 SEO210 마우스 휠 스크롤을 가로 이동 변경 섹션형 웹사이트 HTML/CSS/스크립트 웹사이트 마우스 스크롤로 세로에서 가로 이동 구현하기 (HTML/CSS/스크립트)웹사이트를 만들다 보면 “요즘 사이트들은 왜 이렇게 부드럽게 넘어가지?” 싶은 순간이 있습니다. 제품 소개, 포트폴리오, 이벤트 페이지처럼 섹션을 크게 보여주는 화면에서는 휠 스크롤을 가로 이동으로 바꿔 콘텐츠를 넘기는 방식이 꽤 자주 쓰입니다. 다만 아무렇게나 적용하면 트랙패드에서 튀거나, 모바일에서 어색해지거나, 스크롤 막힘 때문에 답답하게 느껴질 수 있습니다. 그래서 “가로 이동이 자연스럽게 느껴지는 최소 구성”부터 잡아두고, 필요하면 섬세하게 조정하는 쪽이 결과가 좋습니다.요즘 가장 핫한 웹사이트 트렌드 중 하나는 마우스 스크롤 시 가로 스크롤링 기능을 활용한 구성입니다. 티스토리 스킨, 워드프레스 테마, 랜딩 페이지.. 블로그 수익화/블로그 SEO 2026. 1. 7. 더보기 ›› 워드프레스 사이드바 모바일 숨김 + PC 전용 위젯 노출, 좌/우 추가 sticky 설정 워드프레스 사이드바 숨기기 & 좌/우 추가, 위젯 모바일 숨김 + 스크롤 따라오기 설정워드프레스는 PC에서 화면 폭이 넉넉할 때 사이드바(위젯)를 잘만 쓰면 카테고리, 인기글, 검색, 공지 같은 요소를 자연스럽게 노출할 수 있습니다. 문제는 모바일입니다. 모바일에서 사이드바가 본문보다 먼저 길게 나오거나, 위/아래로 과하게 늘어지면 본문까지 스크롤을 내려야 하는 구간이 생기고, 이게 체감 이탈로 바로 이어집니다. 특히 앱/웹뷰 환경에서는 “상단에 길게 붙는 위젯”이 더 자주 보입니다.그래서 오늘은 모바일에서는 사이드바를 숨기고, PC에서는 필요할 때만 보이게 하거나(또는 특정 위젯만 노출), 추가로 좌/우 사이드바를 구성하는 방식까지 한 번에 정리합니다. 참고로 “사이드바에 애드센스 광고를 고정” 같은 .. 블로그 수익화/블로그 SEO 2026. 1. 7. 더보기 ›› 티스토리 사이드바 고정해제 sticky 고정, 높이·폭 사이즈 조절까지 CSS 티스토리 사이드바 고정해제 & 마우스 스크롤 따라오게 설정, 사이즈 조절 CSS티스토리에서 사이드바는 “있으면 편한데, 잘못 잡히면 불편한” 영역입니다. 본문만 깔끔하게 보여주고 싶을 땐 사이드바를 끄는 게 정답일 때가 많고, 반대로 카테고리/공지/최근글/구독 버튼처럼 독자가 바로 눌러야 하는 요소가 있다면 사이드바가 확실히 힘을 냅니다. 문제는 스킨에 따라 사이드바가 고정되어 있다가 콘텐츠가 길어지면 하단 위젯이 잘리거나, 반대로 너무 안 따라와서 읽는 중에 사용성이 뚝 떨어지는 케이스가 생긴다는 겁니다. 2026년 기준으로도 해결 방향은 똑같습니다. 스킨에서 쓰는 사이드바 셀렉터(#aside, #sidebar, .area-aside 등)를 찾고, position: sticky 중심으로 안정적으로 조정.. 블로그 수익화/블로그 SEO 2026. 1. 7. 더보기 ›› 반응형 이전 1 ··· 22 23 24 25 26 27 28 ··· 70 다음