Javascript

【Javascript】レスポンシブなJS / CSSライトボックスimg lightbox

August 5, 2018
img-lightbox

img-lightboxはレスポンシブなJS / CSSライトボックス。

CDN

jsDelivr

https://cdn.jsdelivr.net/gh/englishextra/img-lightbox@0.1.1/img-lightbox.min.js

https://cdn.jsdelivr.net/gh/englishextra/img-lightbox@0.1.1/img-lightbox.min.css

Setup

class“img-lightbox-link”が必要になり、data-srcイメージのURLを含めます。
example:

<a href="https://farm1.staticflickr.com/955/27854475488_4f2b7f52e4_k.jpg"
class="img-lightbox-link"
data-src="https://farm1.staticflickr.com/955/27854475488_4f2b7f52e4_k.jpg"
aria-hidden="true"
rel="lightbox"><img src="https://farm1.staticflickr.com/955/27854475488_5f82a379ca_z.jpg" alt="Image Lightbox" /></a>

MIT