Xây dựng các tiện ích theo thẻ được đáp ứng với GridTab
Xây dựng trang web luôn dễ dàng hơn công cụ nguồn mở thay vì phát minh lại bánh xe. Các công cụ này bao gồm từ thư viện đến các plugin nhỏ hơn nhưng về cơ bản bạn có thể tìm ra giải pháp cho mọi thứ.
Hiện tượng Plugin GridTab của jQuery là một ví dụ tốt Nó cho phép bạn thiết lập lưới tùy chỉnh, xác định các điểm dừng, và tạo một tiện ích theo thẻ phù hợp với bất kỳ trang web.
Bạn có thể thêm các lớp CSS của riêng bạn hoặc làm việc với các lớp hiện có để tạo một tính năng tab phù hợp với thiết kế của bạn. Plugin này cũng hỗ trợ yếu tố điều hướng cho các điều khiển tiếp theo / trước và chuyển đổi giữa các tab.
Cài đặt rất dễ dàng và nó chỉ yêu cầu Thư viện jQuery như một sự phụ thuộc. Sau khi được cài đặt, bạn có thể lấy GridTab từ npm hoặc tải xuống trực tiếp từ GitHub.
Hãy ghi nhớ plugin tiện ích theo thẻ này có một kiểu mặc định, vì vậy nó có một biểu định kiểu CSS riêng trên cùng của tệp plugin JS. Nhưng, bạn luôn có thể hợp nhất CSS này vào CSS của riêng bạn để giảm yêu cầu HTTP.
Để khởi tạo plugin, bạn chỉ cần vượt qua tổng kích thước lưới cùng với bất kỳ tham số tùy chọn (tất cả được liệt kê trên GitHub).
Đây là một đơn giản kịch bản khởi tạo:
$ (tài liệu). yet (function () $ ('# Gridtab-1'). Gridtab (Grid: 3);); Cài đặt bao gồm bộ chọn tùy chỉnh, phong cách đáp ứng, cài đặt viền / đệm / màu, và tất nhiên, một chức năng gọi lại.
Bạn có thể tò mò muốn xem tất cả những thứ này hoạt động như thế nào và nó trông như thế nào trong trình duyệt của bạn. Kiểm tra “Trình diễn” phần để xem một một vài ví dụ, kể cả mã nguồn thô bạn có thể sao chép.
Hầu hết mọi người nghĩ về các tab như các tính năng cho các widget cấu hình nhỏ. Tuy nhiên, trang web danh mục đầu tư cũng có thể sử dụng lưới với các tính năng theo thẻ và plugin GridTab là tài nguyên tốt nhất để tạo hiệu ứng này.
Mọi thứ bạn cần biết, bao gồm tài liệu đầy đủ, có thể được tìm thấy trên trang GridTab chính. Điều này cũng bao gồm một liên kết đến repo GitHub để bạn có thể duyệt qua nguồn và bắt đầu tùy chỉnh các lưới được phản hồi theo thẻ của riêng bạn.
