meta-lightbox/dist/index.html

3 lines
1.6 KiB
HTML
Raw Normal View History

2020-04-20 12:01:34 +02:00
<!doctype html><html lang="en"><head><meta charset="utf-8"/><meta name="viewport" content="width=device-width,initial-scale=1,shrink-to-fit=no"><meta name="description" content=""><meta name="author" content=""><link rel="stylesheet" href="https://stackpath.bootstrapcdn.com/bootstrap/4.3.1/css/bootstrap.min.css"/><link rel="stylesheet" href="https://use.fontawesome.com/releases/v5.4.0/css/all.css"/><script src="https://ajax.googleapis.com/ajax/libs/jquery/3.4.1/jquery.min.js"></script><title>Meta-lightbox Demo</title><style>.wrapper {
2019-11-27 06:27:09 +01:00
padding: 2rem;
2020-12-24 23:53:50 +01:00
}</style><link href="./css/app.css" rel="stylesheet"></head><body><div class="wrapper"><h1>Meta-lightbox Demo</h1><p><a href="../src/img/photo1.png" data-toggle="lightbox" data-lightbox-gallery="demo" data-title="That's first link">Click me to start</a></p><p><a href="../src/img/photo2.jpg" data-toggle="lightbox" data-lightbox-gallery="demo">Use data-toggle="lightbox" attribute to attach lightbox action and href to specify URL.</a></p><p><a href="../src/img/photo1.png" data-toggle="lightbox" data-lightbox-gallery="demo" data-title="Use data-title attribute to specify lightbox title">Use data-lightbox-gallery="YOUR_GALLERY_NAME" to group ligthboxes and use next/prev arrows</a></p><p data-toggle="lightbox" data-href="https://youtu.be/GgnClrx8N2k" data-lightbox-gallery="demo" data-title="Yes you can link vimeo and youtube videos as long as AJAX content">You can use data-href attribute to specify link and attach lightbox to another element</p><p><b>Note:</b> You can add jquery-zoom plugin and lighbox will zoom photos on hover.</p></div><script src="./js/app.js"></script></body></html>