나는 각자가 사용자의 창을 채우는 몇 개의 섹션으로 단일 페이지 웹 사이트를 만들고있다. 나는 그 일을하고있다.Javascript - onscroll이 다음 앵커로 부드럽게 이동합니까? 어떻게?
는 내가하고 싶은 것입니다 :
때 사용자가 스크롤 위 또는 아래로 그/그녀가 쉽게 업 것이 이전 또는 이후 아래로 (따라) 섹션 또는를. 내 섹션마다 맨 위에 앵커가 있습니다.
다음은 내가 달성하고자하는 예입니다. 각 기사가 페이지를 채 웁니다. 일단 스크롤하면 다음 기사로 건너 뜁니다.
나는이 플러그인을 사용하여 작업을 완료 할 수 있다고 생각한다 : https://github.com/alvarotrigo/fullPage.js.
또한 적극적으로 업데이트되는 것으로 보입니다. 레포에 대한 마지막 커밋은 3 일 전에 이루어졌습니다.
건배!
당신은 scrollorama 및 superscrollorama 살펴 보셔야합니다.
사용자가 제공 한 사이트와 마찬가지로 스크롤 할 때 사용할 수있는 멋진 효과가 많이 있습니다.
--UPDATE--
어떤 영업 이익과 이야기 후, 나는 두 라이브러리는 그가 원하는 것을하지 않는 것을 깨달았다. 제 제안은, js 프리젠 테이션 라이브러리입니다.
감사합니다. 나는 그것을 조사 할 것이다! –
거기에 좋은 스크롤 것들이 많이 있지만, 나는 정말로 이것을 찾지 못했습니까? 나는 명백한 것을 놓치고 있는가? –
당신이 원하는 것은 스콜라 로마와 수퍼 클로 라라 마 모두에서 "핀 고정"과 같습니다. 그렇지 않습니까? – josemando
onscroll에서 실제로 이렇게하고 싶지는 않습니다. onscroll은 "페이지 뷰가 이동 중임"이라는 이벤트를 제외하고는 아무 것도 아니라고 생각하십시오.
그렇다고해서 마우스 휠을 사용하고있는 것은 아닙니다.
휴대 전화에서 계획을 이해할 수 있습니다. 그러면 스 와이프 동작과 같은 끌기 동작을 만드는 것과 같습니다. 큰.
내가 선호하는 스크롤 방법은 마우스 가운데 버튼을 클릭 한 다음 앵커 포인트 바로 아래에 마우스를 놓아서 각 텍스트 블록이 화면을지나 스크롤 할 때 읽을 수 있도록하는 것입니다.
긴 블록의 경우 마우스를 사용하지 않아도됩니다.
제 경우에는 onscroll이 초당 60 회의 이벤트가 발생하고 기사를 자동 점프하는 경우 전체 사이트 콘텐츠를 순간 이동합니다.
다른 사람들은 여전히 실제 스크롤바를 드래그합니다.
페이지를 움직이는 방법이 아닌 마우스 휠과 키 (위/아래, 위로/아래로)를 듣는 것이 더 안전합니다. ...하지만 모든 기사가 가고 있는지 확인하십시오 어리석은 작은 해상도 (iPhone 3)에서도 모든 콘텐츠가 모든 브라우저 창에 맞도록 충분히 작습니까?
콘텐츠를 읽는 사람들이 스크롤해야하는 경우 갑자기 훨씬 더 복잡한 해결책을 다룰 수 있습니다.
다음 중 어떤 것에 대한 일반 (또는 사용자 정의) 스크롤 요청을 경청해야합니다. 친절하고 현재 콘텐츠의 맨 아래로 가려면 ... 사용자에게 시각적 대기열을 제공해야합니다. 이제는 콘텐츠의 맨 아래에 있습니다. 트리거 방법 (스 와이프/드래그/키/mwheel)은 기사를 전환합니다.
첫 번째 두 개는 괜찮습니다 ... ... 스마트 폰처럼 봄철 느낌이 들도록하십시오.
... 사람들이 초를 여러 번 치고 그들이 어디로 갈지 알아 내려고하는 다른 두 가지는 어떨까요?
팁 주셔서 감사합니다! 내가 만들고있는 웹 사이트에는 각 섹션에 대한 텍스트/정보가 거의 없습니다. 기본적으로 매우 작은 모바일 화면 (적어도 테스트 한 모든 것들)에서 작동한다는 것을 의미합니다. 또한 Media-Queries를 사용하며 모바일 용 버전이 약간 다릅니다. –
정말로 하시겠습니까? 사용자가 기대하는 기본 스크롤 동작이 중단됩니다. – Stuart
내가 이것을 사용하고 싶은 것이 틀림 없음. 그것은 매우 간단하고 짧은 페이지입니다. 그런 다음 유익한 사이트가 아닌 디자인 실험의 종류. –