작성자 없음
작성자 정보가 삭제된 글입니다.
작성
·
268
0
스크롤도 늘어나질 않고 스티키도 안보이고 씬도 변하질 않고 계속 0에 있어요ㅜㅜ 첨부하겠습니당
const main = () => {
let y0ffset = 0;
const sceneInfo = [
{
//0
type: 'sticky',
heightNum: 5, //브라우저 높이의 5배로 scrollHeight 세팅
scrollHeight: 0,
objs: {
container: document.querySelector('#scroll-section-0')
}
},
{
//1
type: 'normal',
heightNum: 5,
scrollHeight: 0,
objs: {
container: document.querySelector('#scroll-section-1')
}
},
{
//2
type: 'sticky',
heightNum: 5,
scrollHeight: 0,
objs: {
container: document.querySelector('#scroll-section-2')
}
},
{
//3
type: 'sticky',
heightNum: 5,
scrollHeight: 0,
objs: {
container: document.querySelector('#scroll-section-3')
},
}
];
function setLayout() {
//각 스크롤 섹션의 높이 세팅
for (let i = 0; i < sceneInfo.length; i++) {
sceneInfo[i].scrollHeight = sceneInfo[i].heightNum * window.innerHeight;
sceneInfo[i].objs.container.style.height = `${sceneInfo[i].scrollHeight}px`;
}
console.log(sceneInfo);
}
function scrollLoop() {
}
window.addEventListener('resize',setLayout);
window.addEventListener('scroll',() => {
y0ffset = window.pageXOffset;
scrollLoop();
});
setLayout();
};
main();
답변 1
0
아직 처음 각 섹션의 높이를 설정하는 부분(setLayout)까지만 코딩을 하셨어요~
스크롤 부분은 이벤트만 바인딩을 한 상태고, 아직 아무것도 코딩이 안되었기 때문에 적용이 안되는 것이랍니다.
진도대로 나가시면 됩니다.