Magnific-popup: Open image without link

Created on 29 Mar 2015  路  3Comments  路  Source: dimsemenov/Magnific-Popup

Hi!

Is it possible to load image without a tag, by just adding class directly to image like
.

So i wan't to open image that has class image-popup, but doesn't have a tag.

tnx

Most helpful comment

Thank you!
I would have avoided this setup if it was documented properly:

        var images = $('.content.article article > div img')
        images.each(
            (index, item)=>
            {
                $(item).wrap(`<a class="magnific-popup" href="${item.src}"></a>`)
            }
        )
        $('.magnific-popup').magnificPopup({
          type: 'image'
        })

All 3 comments

would also like to know

<img src="path/to/myimage.png" data-mfp-src="path/to/myimage.png" class="popup-img">
$('.popup-img').magnificPopup({
  type: 'image'
});

Like this? No need for the <a> tag. The image's src and data-mfp-src attributes don't need to be equal (so for example you can have src="thumbnail.png" and data-mfp-src="biggerimage.png").

Thank you!
I would have avoided this setup if it was documented properly:

        var images = $('.content.article article > div img')
        images.each(
            (index, item)=>
            {
                $(item).wrap(`<a class="magnific-popup" href="${item.src}"></a>`)
            }
        )
        $('.magnific-popup').magnificPopup({
          type: 'image'
        })
Was this page helpful?
0 / 5 - 0 ratings

Related issues

ghost picture ghost  路  5Comments

mifas picture mifas  路  5Comments

despecial picture despecial  路  5Comments

klihelp picture klihelp  路  4Comments

Madeirense picture Madeirense  路  6Comments