Share Ghim các thành phần trên website với thư viện jQuery Pin

[filiallion]

Language

Tiếng Việt

Trên một số website các bạn có thể bắt gặp hiệu ứng thanh trình đơn nằm ở vị trí ở giữa website và khi người dùng cuộn website thì thanh trình đơn duy chuyển tới vị trí trên rồi ghim cứng tại đó. Đây là một hiệu ứng hay có tính tương tác tốt với người dùng mà vẫn đảm bảo nội dung website được thể hiện đầy đủ. Để thực hiện được hiệu ứng này, các bạn có thể sử dụng thư viện jQuery Pin.

Các bạn tải thư viện jQuery Pin tại địa chỉ http://webpop.github.io/jquery.pin.

Các bạn lưu ý là thư viện jQuery Pin yêu cầu phải tích hợp jQuery. Các bạn tải thư viện jQuery tại địa chỉ http://jquery.com/download.

Các bạn tích hợp thư viện jQuery Pin vào website với dòng lệnh như sau:

<script src="path/to/jquery.pin.min.js"></script>

Và cài đặt thư viện với nội dung mã lệnh như sau:

$(function() {
    $('.jquery-pin').pin();
});

Với cài đặt như trên thì các bạn có thể áp dụng với thành phần muốn ghim như ví dụ sau:

<div class="jquery-pin"></div>

Các bạn có thể tìm hiểu thêm về thư viện jQuery Pin tại địa chỉ http://webpop.github.io/jquery.pin.