[Frontend] TIL September 3rd week
210913
perspective와 translateZ 이용한 전후(원근법) 스크롤 페이지
스크롤 내린만큼 아티클이 앞으로 옴
스크롤 움직일때 마다 > 스크롤탑 가져와서 > 각아티클 translateZ값에 더해주기
210914
포폴세로양식 만들기
//윈도우 시작시 화면 맨위로 이동(jq)
$("body,html").stop().animate({"scrollTop":0},1500,"swing");
//이미지 중앙정렬(jq), css에서 50% 이동 후 자신크기 반만큼 돌아오는 것과 비슷
var t = $(window).height() / 2 - $("#quick").height() / 2;
$("#quick").stop().animate({"top":t},700,"linear");
210915
포폴세로양식 이어서 + 헤더없는경우
헤더 있을 경우, 스크롤 이동하는 기능과 addclass("on")되는 기능 만들 때 해더길이만큼 덜(또는 더?) 이동하도록
setTimeout 사용해서 첫 컨텐트에서 스크롤 안해도 초기에 addclass("on")되도록
210916
랜딩페이지 코딩
210917
랜딩페이지 코딩
perspective와 translateZ 이용한 전후(원근법) 스크롤 페이지
스크롤 내린만큼 아티클이 앞으로 옴
스크롤 움직일때 마다 > 스크롤탑 가져와서 > 각아티클 translateZ값에 더해주기
포폴세로양식 만들기
//윈도우 시작시 화면 맨위로 이동(jq)
$("body,html").stop().animate({"scrollTop":0},1500,"swing");
//이미지 중앙정렬(jq), css에서 50% 이동 후 자신크기 반만큼 돌아오는 것과 비슷
var t = $(window).height() / 2 - $("#quick").height() / 2;
$("#quick").stop().animate({"top":t},700,"linear");
210915
포폴세로양식 이어서 + 헤더없는경우
헤더 있을 경우, 스크롤 이동하는 기능과 addclass("on")되는 기능 만들 때 해더길이만큼 덜(또는 더?) 이동하도록
setTimeout 사용해서 첫 컨텐트에서 스크롤 안해도 초기에 addclass("on")되도록
210916
랜딩페이지 코딩
210917
랜딩페이지 코딩
포폴세로양식 이어서 + 헤더없는경우
헤더 있을 경우, 스크롤 이동하는 기능과 addclass("on")되는 기능 만들 때 해더길이만큼 덜(또는 더?) 이동하도록
setTimeout 사용해서 첫 컨텐트에서 스크롤 안해도 초기에 addclass("on")되도록
랜딩페이지 코딩
210917
랜딩페이지 코딩
랜딩페이지 코딩
리뉴얼디자인 랜딩페이지 완료
Author And Source
이 문제에 관하여([Frontend] TIL September 3rd week), 우리는 이곳에서 더 많은 자료를 발견하고 링크를 클릭하여 보았다 https://velog.io/@hyeonze/Frontend-TIL-September-3rd-week저자 귀속: 원작자 정보가 원작자 URL에 포함되어 있으며 저작권은 원작자 소유입니다.
우수한 개발자 콘텐츠 발견에 전념 (Collection and Share based on the CC Protocol.)