JavaScript

Chúng ta có thể gọi các hàm có trong thư viện JavaScript của Twitter Bootstrap theo hai cách khác nhau:

  • Sử dụng data-attribute: Với cách này bạn sẽ gọi các hàm trong thư viện bằng cách thêm các thuộc tính data trong mã HTML của phần tử mà không phải viết bất cứ dòng lệnh JavaScript nào.
  • Sử dụng mã lệnh JavaScript: Với cách này bạn sẽ viết mã lệnh JavaScript dựa trên A.P.I được Twitter Bootstrap cung cấp.

Modal

Modal được dùng để hiển thị hộp thoại (thường là sau một sự kiện của người dùng như click vào nút bấm). Để tạo modal trong Twitter Bootstrap chúng ta cần viết mã HTML với cấu trúc tương tự như sau:

Cilck vào nút bấm phía dưới để hiển thị modal

Tab

Để tạo tab bạn sử dụng đoạn mã HTML như dưới đây.

Nội dung tab "Home"

Nội dung tab "Profile"

Nội dung tab "Settings"

Tooltip

Để tạo tooltip chúng ta sử dụng đoạn mã HTML như dưới đây:

Vô Hiệu Hoá data-attribute

Trong trường hợp mã lệnh của trang HTML chứa thuộc tính data attribute trùng với một loại data attribute được quy định trong thư viện JavaScript của Twitter Bootstrap nhưng bạn không muốn gọi hàm JavaScript tương ứng. Lúc này bạn có thể vô hiệu hoá tính năng JavaScript bằng cách chèn đoạn mã JavaScript sau:

$(document).off('.data-api')

Hoặc bạn có thể vô hiệu hoá một phần tử nhất định:

$(document).off('.alert.data-api')
Twitter Bootstrap
Thêm Bình Luận: