effect3 Position Sticky를 구현하는 Fixed JS 코드 활용 1. 원글: Position Sticky를 구현하는 Fixed JS 코드 오류 수정 2. 수정: Position Sticky를 구현하는 Fixed JS 코드 2차 수정본 3. 수정: Position Sticky를 구현하는 Fixed JS 코드 3차 수정본 4. 수정: Position Sticky를 구현하는 Fixed JS 코드 4차 수정본 5. 활용: 본문 cloneNode()를 사용하여 DOM 객체의 복제본을 만들지 않고, siblings()를 사용하여 'position: fixed' 지정할 객체의 위 혹은 아래 객체(element)에 margin 속성을 부여하는 방법입니다. 1. 'position: fixed' 객체의 빠져나간 공간을 상위 sibling 객체에 marginBottom을 지정하여 메우는.. 2021. 10. 5. 댓글 Position Sticky를 구현하는 Fixed JS 코드 3차 수정본 1. 원글: Position Sticky를 구현하는 Fixed JS 코드 오류 수정 2. 수정: Position Sticky를 구현하는 Fixed JS 코드 2차 수정본 3. 수정: 본문 4. 수정: Position Sticky를 구현하는 Fixed JS 코드 4차 수정본 5. 활용: Position Sticky를 구현하는 Fixed JS 코드 활용 2, 3차 수정 코드 비교하고 간단한 설명 덧붙입니다. ※ The HTMLElement.offsetTop read-only property returns the distance of the outer border of the current element relative to the inner border of the top of the offsetParent.. 2021. 6. 13. 댓글 Position Sticky를 구현하는 Fixed JS 코드 2차 수정본 1. 원글: Position Sticky를 구현하는 Fixed JS 코드 오류 수정 2. 수정: 본문 3. 수정: Position Sticky를 구현하는 Fixed JS 코드 3차 수정 4. 수정: Position Sticky를 구현하는 Fixed JS 코드 4차 수정 5. 활용: Position Sticky를 구현하는 Fixed JS 코드 활용 윗글에 이어서 다시 수정한 부분을 반영하여 설명 진행합니다. 수정 내역 1. 블로그의 댓글 리스트에서 한 항목 링크를 누르면 페이지가 열리면서 하단 댓글 리스트로 이동합니다. 이때 "position: fixed"입니다. 페이지의 최상단으로 이동하면 "position: static"으로 변경되어야 하는 데, 오류 때문에 바뀌지 않습니다. 위치 코드를 출력하는 검사.. 2021. 6. 10. 댓글