1. Get started

YPV is a simple and small native Yurba JavaScript open-source component for viewing photos based ongalleries.
Also, we have functionality for scaling, rotating photos, as well as downloading them.

HTML Import YPV sources

<link rel="stylesheet" href="https://cdn.yurba.one/static/yurba-pv/1.1/css/ypv.min.css">
<script type="text/javascript" src="https://cdn.yurba.one/static/yurba-pv/1.1/js/ypv.min.js"></script>

HTML Initialize YPV html component

<yurba-pv></yurba-pv>

HTML Create your photos by template

<a href="image-a.jpeg" data-ypv="gallery" data-id="0" data-caption="Caption #1">
  <img src="thumbnail-a.jpeg" />
</a>

<a href="image-b.jpeg" data-ypv="gallery" data-id="1" data-caption="Caption #2">
  <img src="thumbnail-b.jpeg" />
</a>

JavaScript Bind your images in galleries

let viewer = document.querySelector('yurba-pv')
document.querySelectorAll('[data-ypv]').forEach((link) => {
    viewer.bind(link)
})

JSFiddle Example