[질문] position:fixed 기능 구현중 중앙정렬 페이지에서 고정 위치
초롬
위그림처럼 하늘색 (컨텐츠 바닥) 바탕에 center의 붉은 컨텐츠가 중앙정렬로 들어가는 페이지에
[이녀석]이라는 녀석이 중앙정렬의 오른쪽에 위치하면서
position:fixed기능을 구현하고자 합니다.
position:fixed 핵을 써서 구현을 해보고 있는데
[이녀석] 에 position:fixed; _position:absolute; left:50%; margin-left:숫자 를 줘서 해봤지만
[이녀석]이 브라우저를 줄이면 덩달아 같이 줄어드는 현상이 있어서 골치입니다.
left:50%때문인지 브라우저 창사이즈에 따라서 [center]녀석과 사이 간격이 조금씩 틀리기두 하구요.
음. 11번가의 top버튼 기능이 구현하고자 하는 기능과 거의 같지만
해당 사이트 소스가 많이 나뉘어 있어서 자세히 알지 못하겠더라구요.
혹시 고수님들 중에 이와 비슷한 경험을 가지고 계시거나 구현을 하셨던 분들 가르침 부탁드립니다.
-
알렉산더 2023-05-22
fixed 포지셔닝이면 스크롤바를 내려도 검은색 박스가 윗쪽으로 일정간격 만큼 떨어져 있어어 하는걸 말씀하시는것 같은데요... 상단 위치는 고정적이지만 left 포지션이 가변젹이니까,,, 스크립트로 해결하는것도 하나의 방법이 되지 않을까 의견을 드려 봅니다.
-
서향 2023-05-22
빨간색에 position: relative를 주신다음 검은색에 position: absolute; top: **px; right: -**px; 로 처리해보세요
물론 검은색div는 빨간색div안에 있어야겠죠 -
힘찬 2023-05-22
스크롤 따라 상하 이동이라면 스크립트 써야 될거 같네요~ 위치 잡는건 수다님 방법대로 하시면 됩니다