Share Tạo select đẹp mắt với thư viện jQuery Nice Select

filiallion · 09/14/2018

Để thay đổi diện mạo của thẻ select trên các website thì các bạn có thể sử dụng CSS để thiết kế hoặc sử dụng các thư viện JavaScript sẽ đơn giản hơn. Trước đây, tôi cũng đã giới thiệu với các bạn thư viện jQuery UI Selectmenu tại bài viết "Tuỳ biến select với thư viện jQuery UI Selectmenu". Bài viết này tôi tiếp tục hướng dẫn các bạn tuỳ biến select với thư viện jQuery Nice Select.

Để sử dụng thư viện jQuery Nice Select các bạn cần phải tích hợp thư viện jQuery. Các bạn tải thư viện jQuery tại địa chỉ http://jquery.com/download.

Các bạn tải thư viện jQuery Nice Select tại địa chỉ http://hernansartorio.com/jquery-nice-select và tích hợp vào website với nội dung mã lệnh như sau:

HTML:

<link href="path/to/nice-select.css" rel="stylesheet">
<script src="path/to/jquery.nice-select.min.js"></script>

Các bạn cài đặt thư viện jQuery Nice Select với nội dung mã lệnh như sau:

JavaScript:

$(function() {
    $('.nice-select').niceSelect();
});

Và áp dụng cho select nào đó như ví dụ sau:

HTML:

<select class="nice-select">
    <option value="1">Option 1</option>
    <option value="2">Option 2</option>
    <option value="3">Option 3</option>
</select>

Các bạn có thể tìm hiểu thêm về thư viện jQuery Nice Select tại địa chỉ http://hernansartorio.com/jquery-nice-select.

Share Tạo select đẹp mắt với thư viện jQuery Nice Select

filiallion

Administrator