JS: FacebookのLikeボタンが押された時にCallbackを取得する #JavaScript

自サイトにいいねボタンを設置したのはいいけど、コメント欄が画面外にはみ出てしまう問題が多々あります。
その場合はGraph APIを使いLikeボタンのCallbackを取得し、DOMオブジェクト毎画面内に移動させることで、なんとかなる場合があります。

以下はその際のコールバックの取得方法。
position:absolute;で配置しないと他要素にも影響を与えてしまうので、そこだけ注意。
あとはパフォーマンスを重視するサイトの場合、API側でイベントの監視が行われるので若干処理が重くなる可能性があります。

[URL]: 設置するURL

index.html

<div id="fb-container">
<div id="fb-root"></div>
<div class="fb-like" data-href="[URL]" data-width="80" data-layout="button" data-action="like" data-show-faces="false" data-share="false"></div>
</div>

[Facebook App ID]: FacebookのアプリID

fb.js

window.fbAsyncInit = function() {
  FB.init({
    appId      : '[Facebook App ID]',
    xfbml      : true,
    version    : 'v2.2'
  });

  var dom = $('#fb-container');

  FB.Event.subscribe( 'edge.create', function(response) {
    dom.animate({ right: 370 }, 0, 'swing', function(){});
  });

  FB.Event.subscribe( 'edge.remove', function(response) {
    dom.animate({ right: '' }, 0, 'swing', function(){});
  });

  FB.Event.subscribe( 'comment.create', function(response) {
    dom.animate({ right: '' }, 0, 'swing', function(){});
  });

  FB.Event.subscribe( 'comment.remove', function(response) {
    dom.animate({ right: '' }, 0, 'swing', function(){});
  });
};

(function(d, s, id){
   var js, fjs = d.getElementsByTagName(s)[0];
   if (d.getElementById(id)) {return;}
   js = d.createElement(s); js.id = id;
   js.src = "//connect.facebook.net/ja_JP/sdk.js";
   fjs.parentNode.insertBefore(js, fjs);
 }(document, 'script', 'facebook-jssdk'));

イベントの説明

edge.create: Likeボタンが押された時
edge.remove: Likeボタンをキャンセルした時
comment.create: コメントを投稿した時
comment.remove: コメントをキャンセルした時

その他のイベントは以下を参照。
https://developers.facebook.com/docs/reference/javascript/FB.Event.subscribe/v2.2