Binding Magnific Popup plugin to a button (besides the gallery element itself)

Question

I successfully implemented my Magnific Popup plugin, binding it to the gallery element (a div containing a set of img elements wrapped up in a elements). But I also want the lightbox to appear when clicking on a separate "see gallery" button.

I can't see anywhere how to achieve that in the documentation. Is it even possible?

Please provide your actual HTML and JS code. – Paweł Tomkiel Mar 07 '15 at 15:20 — Paweł Tomkiel, Mar 07 '15 at 15:20

score 3 · Accepted Answer · answered Mar 05 '15 at 15:06

3

You can just trigger click event via JS, e.g.:

$('.popup-gallery').find('a').eq(0).trigger('click');

answered Mar 05 '15 at 15:06

Dmitry Semenov

4,566
2
36
39

Just what I need, thanks! Any idea why the scroll position of the page changes (to about one screen upwards) when opening the gallery this way, while it remains unchanged by opening it by clicking on one of the pictures? – drake035 Mar 09 '15 at 21:26
1

Hard to tell without link to the page with issue. Do parent elements have any kind of links with #hashes? – Dmitry Semenov Mar 12 '15 at 21:51

score 1 · Answer 2 · edited May 23 '17 at 12:03

1

Basically, when the "see gallery" button is clicked you want to trigger the click event on the element that normally opens the popup, so that the popup will open. See this question for some good ways of doing this.

edited May 23 '17 at 12:03

Community

1
1

answered Mar 05 '15 at 04:31

firefoxuser_1

1,793
13
22

Binding Magnific Popup plugin to a button (besides the gallery element itself)

2 Answers2