Share Thực thi một hàm khi cuộn website đến thành phần được chỉ định với thư viện Waypoints

[filiallion]

Language

Tiếng Việt

Trong lập trình JavaScript, các bạn muốn thực hiện một chức năng nào đó bằng cách sử dụng các sự kiện để gọi hàm thì không quá khó khăn. Nhưng trong trường hợp các bạn muốn khi cuộn website tới đối tượng nào đó để tự động gọi hàm thực thi chức năng đã định nghĩa trong hàm thì đòi hỏi các bạn phải sử dụng thư viện mở rộng và thư viện tôi giới thiệu với các bạn để làm việc này đó là thư viện Waypoints.

Các bạn tải thư viện Waypoints tại địa chỉ https://github.com/imakewebthings/waypoints/zipball/latest.

Tích hợp thư viện Waypoints vào website với dòng mã lệnh như sau:

<script src="path/to/noframework.waypoints.min.js"></script>

Và cài đặt bắt sự kiện khi cuộn website tới thành phần như sau:

var waypoint = new Waypoint({
    element: document.getElementById('waypoint'),
    handler: function() {
        notify('Welcome to Gextend');
    }
});

Ở vị trí nào đó trên website, các bạn trình bày thành phần được khai báo như sau:

<div id="waypoint">Scroll here</div>

Các bạn có thể tìm hiểu thêm về thư viện Waypoints tại địa chỉ http://imakewebthings.com/waypoints.