biati-digital / glightbox

Pure Javascript lightbox with mobile support. It can handle images, videos with autoplay, inline content and iframes
MIT License
2.03k stars 228 forks source link

How to add description and title via the API #515

Closed tacman closed 1 month ago

tacman commented 1 month ago

How do I add a description (and title, etc.) via the API? The examples all appear to be data- attributes

        import 'https://cdn.jsdelivr.net/gh/mcstudios/glightbox/dist/js/glightbox.min.js';

        var exampleApi = GLightbox({ selector: null });
        fetch('https://dummyjson.com/products')
            .then(response => response.json())
            .then(data => {
                data.products.forEach(product => {
                    product.images.forEach( i => {
                        exampleApi.insertSlide({
                            href: i,
                            // content: '<p>some html to append in the slide</p>',
                            // description: "A description"
                        });

                    })
                });
                exampleApi.open();

            })
            .catch(err => console.error(err))
tacman commented 1 month ago
    <script type="module">
        import 'https://cdn.jsdelivr.net/gh/mcstudios/glightbox/dist/js/glightbox.min.js';

        var exampleApi = GLightbox({ selector: null });
        exampleApi.insertSlide( {
            'href': 'https://picsum.photos/1200/800',
            'type': 'image',
            'title': 'My Title',
            'description': 'Example',
        });
        exampleApi.open();
</script>

throws an error:

stimulus.index-b5b1d00e42695b8959b4a1e94e3bc92a.js:7 application #start glightbox.min.js:1 Uncaught TypeError: v.getAttribute is not a function at e.value (glightbox.min.js:1:52654) at glightbox.min.js:1:41042 at glightbox.min.js:1:22791 at HTMLImageElement. (glightbox.min.js:1:14623)

glightbox.min.js:1 Uncaught TypeError: v.getAttribute is not a function at e.value (glightbox.min.js:1:52654) at glightbox.min.js:1:41042 at glightbox.min.js:1:22791 at HTMLImageElement. (glightbox.min.js:1:14623)