2012-04-05 34 views
9

Tôi có một vài neo liên kết đến các phần cụ thể (sử dụng thẻ bắt đầu bằng #) trong trang và các thanh cuộn lên đầu hoặc cuối cửa sổ tài liệu.Scrolling/Scrollbar Locks Sau khi Scrolltop Animation

$("html, body").animate({ scrollTop: $(document).height() }, 2000); 

Tuy nhiên, ngay khi hoạt ảnh và cuộn đã đến đích và hoàn thành, cuộn tài liệu và thanh cuộn dường như tắt trong vài giây. Ví dụ: nếu nhấp vào liên kết "Chuyển đến cuối trang", cửa sổ tài liệu của tôi sẽ cuộn xuống cuối trang một cách chính xác. Ngay sau khi tôi cố gắng cuộn lùi lại, nó lắc lư một chút lên xuống trong một chuyển động jittery và cho phép tôi di chuyển một vài cố gắng sau này.

Bất kỳ mẹo nào về điều gì có thể gây ra điều này?

Trả lời

16

chủ đề này là cũ, nhưng tôi chạy vào này và có arent câu trả lời bất cứ nơi nào, nhưng đây là một giải pháp:

$(window).bind("mousewheel", function() { 
    $("html, body").stop(); 
}); 

nếu người dùng sử dụng thanh cuộn trong khi các hình ảnh động được thực hiện, nó dừng lại các hình ảnh động.

+0

Wow! Điều này giải quyết vấn đề cho tôi quá, cảm ơn rất nhiều để chia sẻ! :) –

+0

Cảm ơn bạn, cảm ơn bạn, cảm ơn bạn! – TWright

7

Chỉ cần để đóng góp cho câu trả lời Scotty, bạn có thể thực sự cũng thêm hai lựa chọn cho .stop() phương pháp: clearQueue & jumpToEnd.

Tôi đã gặp vấn đề về cuộn và sử dụng đề xuất .stop() của Scotty để bắt đầu, nhưng nhận thấy rằng hoạt ảnh vẫn đang "đấu tranh" để kết thúc. Tôi đã kiểm tra ra tài liệu ở đây: .stop() Method Documentation

Bằng cách thêm .stop(true, false); tôi đã có thể:

1.) loại bỏ hình ảnh động xếp hàng đợi (chỉ trong trường hợp nhiều đã được kích hoạt/tầng)

2.) ngăn chặn các hình ảnh động từ cố gắng nhảy đến giá trị cuối cùng của nó.

Hy vọng rằng sẽ giúp bất kỳ ai khác đập đầu vào bàn phím;)