Giới thiệu fslightbox và download fslightbox  

Một fslightbox  plugin dễ sử dụng nhưng mạnh mẽ để hiển thị nhiều loại nguồn khác nhau trong một hộp bên trên đẹp mắt với rất nhiều tính năng như chú thích, hình thu nhỏ, phóng to và hơn thế nữa!  không cần jQuery!

Link download: tại đây

Link chính chủ để các bạn có thể dọc document này: fslightbox

Link download dự bị:  one driver

 

 

Vanilla Javascript Fullscreen Lightbox là thư viện được viết bằng JavaScript thuần túy mà không có bất kỳ phụ thuộc bổ sung nào. Nghĩa là ko cần thư viện jquery luôn nhe các bạn

Bạn có thể hiển thị hình ảnh, video, bất cứ thứ gì bạn muốn trong hộp bên trên toàn cửa sổ.

 

Các trình duyệt hỗ trợ: Google Chrome, Mozilla Firefox, Safari, Microsoft Edge, Internet Explorer 11,Opera

 

Cách sử dụng fslightbox   : 

 include file js bạn vào source code: 

    <script src="../fslightbox-basic-3.3.1/fslightbox.js"></script>

 

 <a data-fslightbox href="https://i.imgur.com/fsyrScY.jpg">

<img src="exampleImage.jpg">
</a>

 

Với thẻ a có attribute (thuộc tính )  là data-fslightbox thì js sẽ biết là phần tử của fslighbox

giá trị href của thẻ a bạn có thể để cùng giá trị với src của thẻ img bên dưới

 

Bại có thể xem video hướng dẫn của mình bên dưới cho dễ thực hiện nhé

Chúc bạn thành công