Tôi đã tự hỏi liệu có thể vẽ động một đường cong trên trang web khi người dùng cuộn. Tôi khá chắc chắn rằng nó có thể được thực hiện bằng cách sử dụng HTML5 Canvas với phương thức bezierCurveTo(), nhưng điều đó chỉ rút ra toàn bộ điều ngay lập tức.Vẽ một đường cong trên trang web khi người dùng cuộn
Điều này sẽ được sử dụng trên trang web thị sai sử dụng thư viện skrollr.
Có thư viện nào ở đó có thể thực hiện việc này dễ dàng không?
Mọi đề xuất?
Tác giả của skrollr tại đây. Đó là một vấn đề thực sự thú vị mà bạn nghĩ ra. Bạn có biết skrollr hoạt động trên SVG được nhúng không?
Sau 30 phút tìm kiếm (điểm bắt đầu: How to draw a vector path progressively? (Raphael.js)) tôi đã đưa ra bản demo skrollr chính thức sau đây:
http://prinzhorn.github.com/skrollr/examples/path.html
Vâng, tôi rất phấn khởi.
Cảm ơn bạn rất nhiều vì ví dụ này và cho thư viện skrollr rất hữu ích của bạn. Tôi đã thử ví dụ của bạn với firefox và chrome và nó có vẻ hoạt động hoàn hảo trong chrome, nhưng firefox có vẻ như nó là một lỗi nhỏ. Ví dụ này có hoạt động trong tất cả các trình duyệt hiện đại không? – vipergtsrz
Có lẽ bạn nên chơi với quá trình chuyển đổi CSS mà tôi đã thêm vào bản trình diễn để làm cho nó trông giống như cách bạn muốn. Họ có thể gây ra những gì bạn gọi là "lỗi". Có, nó hoạt động trên tất cả các trình duyệt máy tính để bàn hiện đại, ngay cả trong IE 9+ (http://caniuse.com/#feat=svg-html5). Đáng buồn thay nó không có vẻ tốt mà không có chuyển tiếp CSS (Opera không hỗ trợ chúng trên SVG atm). – Prinzhorn
Bây giờ chuyển tiếp CSS không cần thiết nữa, có vẻ như tôi đoán là tốt. skrollr hiện đang làm trơn cuộn chính nó. – Prinzhorn
Đường cong liên quan đến cuộn như thế nào? Đường cong có thay đổi về hình dạng khi người dùng cuộn không? Chúng tôi cần thêm chi tiết. – kevin628
Nó sẽ là một con đường được xác định trước (với nhiều đường cong và thậm chí một số vòng lặp) đi khắp toàn bộ tài liệu. Tốt hơn là, dòng sẽ ẩn và chỉ hiển thị đường màu đen khi người dùng cuộn để cho hiệu ứng của dòng được vẽ khi trang được cuộn xuống. Hy vọng rằng có ý nghĩa. – vipergtsrz