Logo Questions Linux Laravel Mysql Ubuntu Git Menu
 

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

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!

like image 616
Vasily802 Avatar asked Apr 09 '14 06:04

Vasily802


2 Answers

<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

like image 75
Dmitry Semenov Avatar answered Oct 01 '22 19:10

Dmitry Semenov


I actually have not worked, and I found how to do . Now the script when clicking pictures increases and creates a gallery of them .

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


                });
            });
</script>
like image 39
Валентин Савельев Avatar answered Oct 01 '22 17:10

Валентин Савельев