fullPage 특정 섹션에서 헤더 안보이게 하는 방법
관련링크
본문
※자동차담보대출사이트입니다. 스팸같은거 아니고 그누보드로 현재 제가 만들고 있는 합법적 사이트예요.
fullPage 반응형으로 만들고 있는 중인데 slide6번 slide7번에서 상단 header 부분과 오른쪽 동그라비 버튼 #fp-nav 이 안보였다가 다시 상단으로 드래그하면 다시 나타나게하는 방법이 있을까요?
답변 1
1. 슬라이드 7번의 경우 fp-auto-height 클래스를 추가해주세요
(위 움짤에 마지막 7번은 짧게 나오는거 보실 수 있습니다)
그럼 해당 크기 만큼만 설정 됩니다.
2. 헤더와 우측 네비 삭제는 onLeave 혹은 afterLoad를 이용하면 됩니다.
예제 코드는 afterLoad 예제입니다. 아래 코드는 질문자님 #header 코드 추가 하였습니다.
onLeave 와 afterLoad의 차이점은... 섹션을 출발하는 순간 이냐 ? 다음 섹션을 도착하는 순간이냐? 의 차이입니다.
afterLoad:function(origin, destination){
if(destination === 6 || destination === 7){
$("#fp-nav").hide();
$("#header").hide();
}else{
$("#fp-nav").show();
$("#header").show();
}
}
감사합니다~!!!
답변을 작성하시기 전에 로그인 해주세요.