Macro shot of facebook share button only works on second click

Question

I have a gallery with a great pop-up menu with a share button as titleSrc. This is called up by pressing a button:

function callFacebook(item){ console.log(item); FB.ui({ method: 'feed', link: item, caption: 'Die besten Party-Pics bei party-news.de', }, function(response){ console.log(response); }); } 

This is a massive popup call:

 $('.gallery').magnificPopup({ delegate: 'a', // child items selector, by clicking on it popup will open type: 'image', gallery: { enabled:true, tCounter: '%curr% von %total%', preload:false }, image: { verticalFit:false, titleSrc:function(item){ var image = item.el.attr("href"); return '<a class="shareFacebook" onclick="callFacebook(\''+image+'\')" target="_blank"><i class="fa fa-facebook-official"></i>&nbsp;Foto teilen</a>'; } }, tClose: 'Schliessen', tLoading: 'Lade Bild...', // other options }); 

I get the href of the clicked image and pass it to the callFacebook function. The first time I click the sharing button, it just shows the standard og: tags. When I close this window and click the sharing button again - it works. The image is displayed in the sharing dialog box. Any ideas why?

Answer 1

since I don’t see the whole code, it’s hard to say exactly what is happening, either create a small jsbin / jsfiddle or I can try to guess :)

Make sure your initializer function is in jQuery ready function, for example:

 $(document).ready(function(){ $('.gallery').magnificPopup({}); //.... }); 

Hope this helps!