Magnific-popup: how to get image url from <img src="...">?

Vasily802 picture Vasily802 · Apr 9, 2014 · Viewed 8.8k times · Source

Is it possible to force magnific-popup to get image url from 'src' attribute of img tag? This way there would be no need to wrap img with a tags. I tried the code below, but it doesn't work. Returned error is 'undefined' url.

<script type="text/javascript">
  $(document).ready(function(){
    $('div.gallery').magnificPopup({delegate: 'img'.attr('src') , type: 'image', gallery:{enabled:true}
    });
  });
</script>

Anyways, is there any option to do with 'img' only, without 'a' tags? Thanks!

Answer

Dmitry Semenov picture Dmitry Semenov · Apr 10, 2014
<script type="text/javascript">
  $(document).ready(function(){
    $('div.gallery').magnificPopup({delegate: 'img' , type: 'image', gallery:{enabled:true},

     callbacks: {
          elementParse: function() { this.item.src = this.item.el.attr('src'); }
     }

    });
  });
</script>

elementParse http://dimsemenov.com/plugins/magnific-popup/documentation.html#api