2016-01-14 18 views
14

Tôi có câu hỏi liên quan đến các điểm chụp trong CSS (resource, browser-support). Tôi muốn cuộn hoàn toàn bình thường khắp cơ thể cho đến khi phần "ẩn" sau này. Khi người dùng cuộn xuống dưới cùng của phần cuối cùng thứ hai, khung nhìn sẽ chụp với đáy ở cuối phần này (giống như phần trên cùng của phần cuối cùng). Khi người dùng cố gắng cuộn qua một snap này, nó chỉ có thể bằng cách vượt qua một ngưỡng cụ thể.Đơn cuộn-điểm chụp với phần dưới cùng của khung nhìn trước phần cuối cùng của trang

Tôi đã trực quan hóa vấn đề của mình để hiểu rõ hơn, tôi hy vọng sâu sắc điều này là có thể với đặc điểm kỹ thuật hiện tại của các điểm chụp.

enter image description here

+0

http://caniuse.com/#search=snap –

+0

Bạn có chấp nhận câu trả lời bao gồm các ngôn ngữ khác không? –

+0

Nếu bạn có thể cung cấp một đoạn mã hoặc đoạn mã hoạt động, dĩ nhiên :) @FaustoNA – wottpal

Trả lời

4

Đây là như xa như tôi có thể nhận được nó bằng cách sử Alvaro Trigo của thư viện đẹp pagePiling:

http://codepen.io/anon/pen/NxaeZm

Nội dung được tổ chức như sau:

<div id="pagepiling"> 
    <div class="section pp-scrollable" id="section1"> 
     <p>Content that scrolls normally</p> 
    </div> 

    <div class="section" id="hidden"> 
     <p>Not scrollable</p> 
    </div> 

    <div class="section pp-scrollable" id="section2"> 
     <p>Content that scrolls normally again</p> 
    </div> 

</div> 

Giữa phần chiếm đoạt cuộn, và sau đó bạn có thể tiếp tục cuộn về phía phần thứ hai , cuộn lại như một trang bình thường. Tôi chưa thể thêm ngưỡng để truy cập phần giữa. Tôi để nó cho bạn ở đó. Chúc may mắn!

Các vấn đề liên quan