Search code examples
javascriptcssiframefacebook-javascript-sdkfacebook-share

Part of facebook Share Dialog (iframe) is not visible and I cannot move it

I am using the following code to share some content from my website on facebook:

FB.ui({
    method: 'share',
    href: shareUrl
}, function(response){
    if (!response || response.error_message) {
        showError(response);
}});

This is what happens, the Share dialog (iframe) opens at the bottom-left corner of the screen:

enter image description here

after a few seconds my photo is loaded in the share dialog... but since the photo is large it pushes the share dialog beyond the screen... I am not able to move/drag the dialog either...

Is it possible to open the dialog somewhere else? or make it movable?

enter image description here

Solution

  • I found the behavior of facebook share dialog inconsistent... the iframe appears at the center of the screen in dev environment and it appears at the bottom-left corner of the screen in the test environment... I decided to make it a popup instead of an iframe:

    FB.ui({
    method: 'share',
    href: shareUrl,
    display: 'popup'
}, function(response){
    if (!response || response.error_message) {
        showError(response);
}});

    Here is facebook's share dialog documentation, which is not particularly useful anyways.