https://github.com/mvsde/lightbox

Barebones lightbox library.
https://github.com/mvsde/lightbox

css html javascript lightbox

Last synced: 30 days ago
JSON representation

Barebones lightbox library.

• Host: GitHub
• URL: https://github.com/mvsde/lightbox
• Owner: mvsde
• License: other
• Created: 2021-07-01T06:58:26.000Z (over 3 years ago)
• Default Branch: main
• Last Pushed: 2024-01-20T05:56:20.000Z (10 months ago)
• Last Synced: 2024-01-20T08:35:07.628Z (10 months ago)
• Topics: css, html, javascript, lightbox
• Language: JavaScript
• Homepage:
• Size: 1.02 MB
• Stars: 0
• Watchers: 1
• Forks: 0
• Open Issues: 1
• Metadata Files:
  • Readme: README.md
  • License: LICENSE.md

Awesome Lists containing this project

README

        
# Lightbox

Mostly unstyled barebones lightbox library.

## Installation

```bash

npm install @mvsde/lightbox focus-trap

```

## JavaScript

```js

import { Lightbox, LightboxLink } from '@mvsde/lightbox'

const lightbox = new Lightbox({

  element: document.querySelector('#lightbox')

})

lightbox.init()

const lightboxLinks = document.querySelectorAll('.js-lightbox-link')

for (const link of lightboxLinks) {

  new LightboxLink({ element: link, target: lightbox }).init()

}

```

## CSS

```css

@import '@mvsde/lightbox';

```

## Trigger link HTML

```html



  Yosemite valley at dawn



```

## Popup HTML

The `data-padding` attribute is optional and defaults to `32`.

```html



  


    ×

    

      

      

    

  



```