<script type="text/javascript">
$(document).ready(function() {
 $(".fancybox")
    .attr('rel', 'gallery')
    .fancybox({
        beforeShow: function () {
            if (this.title) {
                // New line
                this.title += '<br />';
                //共有するURLについて；画像のURLを共有するときは this.href 、そのページのURLを共有するときは document.URL とする
                // Add tweet button 公式ボタン
                this.title += '<a href="https://twitter.com/share" class="twitter-share-button" data-count="none" data-url="' + encodeURIComponent(this.href) + '" title="Twitter">Tweet</a> ';
                //twitter shere 
                this.title += '<img src="http://urbanqee.com/webutil/photo/lightbox290/images/Twitter.png" width=32 height=32 title="このページの情報を Twitter で共有する" style="cursor: pointer;margin-right:5px;"';
                this.title += ' onclick="window.open(\'http://twitter.com/share?url=' + encodeURIComponent(document.URL) + "&text=" + encodeURIComponent($('title').html()) + '\',' + '\'social_window\',\'width=600,height=600,resizable=yes,scrollbars=yes,toolbar=yes\')">';
                // Add FaceBook like button 公式ボタン
                //this.title += '<iframe src="//www.facebook.com/plugins/like.php?href=' + this.href + '&layout=button_count&show_faces=true&width=500&action=like&font&colorscheme=light&height=23" scrolling="no" frameborder="0" style="border:none; overflow:hidden; width:110px; height:23px;" allowTransparency="true"></iframe>';
                this.title += '<div class="fb-like" data-href="' + document.URL + '" data-layout="button_count" data-action="like" data-size="small" data-show-faces="true" data-share="false"></div>';
                // Add FaceBook share button
                this.title += '<img src="http://urbanqee.com/webutil/photo/lightbox290/images/Facebook.png" width=32 height=32 title="このページの情報を Facebook で共有する" style="cursor: pointer;margin-right:5px;"';
                this.title += ' onclick="window.open(\'http://www.facebook.com/sharer.php?u=' + this.href + '&t=' + $('title').html() + '\',' + '\'social_window\',\'width=600,height=600,resizable=yes,scrollbars=yes,toolbar=yes\')">';
                //LINE it! LINEに送る  （注）client_id=1341209950&state=1409338029 要事前確認
                this.title += '<img src="http://urbanqee.com/webutil/photo/lightbox290/images/line-share-d.png" width=32 height=32 title="このページの情報を LINE に送る" style="cursor: pointer;margin-right:5px;"';
                this.title += ' onclick="window.open(\'https://access.line.me/dialog/oauth/weblogin?response_type=code&client_id=1341209950&state=1409338029&redirect_uri=https%3A%2F%2Ftimeline.line.me%2Fauth%3FreturnUrl%3Dhttps%253A%252F%252Ftimeline.line.me%252Fsocial-plugin%252Fshare%253Furl%253D' + encodeURIComponent(encodeURIComponent(this.href)) + '&t=' + encodeURIComponent(encodeURIComponent($('title').html())) + '\',' + '\'social_window\',\'width=600,height=600,resizable=yes,scrollbars=yes,toolbar=yes\')">';
                //google+1 
                this.title += '<img src="http://urbanqee.com/webutil/photo/lightbox290/images/google_plus.png" width=32 height=32 title="このページの情報を Google+ で共有する" style="cursor: pointer;margin-right:5px;"';
                this.title += ' onclick="window.open(\'https://plus.google.com/share?url=' + encodeURIComponent(this.href) + '\',' + '\'social_window\',\'width=600,height=600,resizable=yes,scrollbars=yes,toolbar=yes\')">';
                //hatena はてなブックマーク
                this.title += '<img src="http://urbanqee.com/webutil/photo/lightbox290/images/hatena-bookmark.png" width=32 height=32 title="このページの情報を はてなブックマーク に追加する" style="cursor: pointer;margin-right:5px;"';
                this.title += ' onclick="window.open(\'http://b.hatena.ne.jp/add?mode=confirm&url=' + encodeURIComponent(this.href) + "&title=" + encodeURIComponent($('title').html()) + '\',' + '\'social_window\',\'width=600,height=600,resizable=yes,scrollbars=yes,toolbar=yes\')">';
                //pocket ポケット
                this.title += '<img src="http://urbanqee.com/webutil/photo/lightbox290/images/getpocket.png" width=32 height=32 title="このページの情報を pocket で共有する" style="cursor: pointer;margin-right:5px;"';
                this.title += ' onclick="window.open(\'http://getpocket.com/edit?url=' + encodeURIComponent(this.href) + "&title=" + encodeURIComponent($('title').html()) + '\',' + '\'social_window\',\'width=600,height=600,resizable=yes,scrollbars=yes,toolbar=yes\')">';
                //mixiチェック - (7) （注２）k=mixiチェックキー (キーは事前登録）
                this.title += '<img src="http://urbanqee.com/webutil/photo/lightbox290/images/mixi-check.gif" width=32 height=32 title="このページの情報を mixi check で共有する" style="cursor: pointer;margin-right:5px;"';
                this.title += ' onclick="window.open(\'https://mixi.jp/share.pl?mode=login&u=' + encodeURIComponent(this.href) + "&k=" + "mixi1234567890" + '\',' + '\'social_window\',\'width=600,height=600,resizable=yes,scrollbars=yes,toolbar=yes\')">';
                //tumblr-post
                this.title += '<img src="http://urbanqee.com/webutil/photo/lightbox290/images/tumblr-logo-whiteonblue-512.png" width=32 height=32 title="このページの情報を Tumblr で共有する" style="cursor: pointer;margin-right:5px;"';
                this.title += ' onclick="window.open(\'https://www.tumblr.com/login?redirect_to=https%3A%2F%2Fwww.tumblr.com%2Fwidgets%2Fshare%2Ftool%3Fposttype%3Dlink%26title%3D' + encodeURIComponent(encodeURIComponent($('title').html())) + "%26content%3D" + encodeURIComponent(encodeURIComponent(this.href)) + "%26canonicalUrl%3D" + encodeURIComponent(encodeURIComponent(this.href)) + "%26shareSource%3Dtumblr_share_button%26_format%3Dhtml" + '\',' + '\'social_window\',\'width=600,height=600,resizable=yes,scrollbars=yes,toolbar=yes\')">';
                //GREE-share
                this.title += '<img src="http://urbanqee.com/webutil/photo/lightbox290/images/gree-btn_logo_32.png" width=32 height=32 title="このページの情報を GREE で共有する" style="cursor: pointer;margin-right:5px;"';
                this.title += ' onclick="window.open(\'https://pid.gree.net/login/entry?ignore_sso=1&backto=http%3A%2F%2Fgree.jp%2F%3Fmode%3Dshare%26act%3Dwrite%26url%3D' + encodeURIComponent(this.href) + "%26button_type%3D3%26button_size%3D20&campaign_code=" + '\',' + '\'social_window\',\'width=600,height=600,resizable=yes,scrollbars=yes,toolbar=yes\')">';
                //Amebaブログ post
                this.title += '<img src="http://urbanqee.com/webutil/photo/lightbox290/images/ameba-icon_app.png" width=32 height=32 title="このページの情報を Amebaブログ で共有する" style="cursor: pointer;margin-right:5px;"';
                this.title += ' onclick="window.open(\'http://blog.ameba.jp/ucs/entry/srventryinsertinput.do?entry_text=' + encodeURIComponent($('title').html()) + "<br>" + encodeURIComponent(document.URL) + "&editor_flg=1" + '\',' + '\'social_window\',\'width=600,height=600,resizable=yes,scrollbars=yes,toolbar=yes\')">';
                //pinterest 
                this.title += '<img src="http://urbanqee.com/webutil/photo/lightbox290/images/pinterest3.png" width=32 height=32 title="このページの情報を Pinterest で共有する" style="cursor: pointer"';
                this.title += ' onclick="window.open(\'https://jp.pinterest.com/join/?next=/pin/create/button/%3Furl%3D' + encodeURIComponent(encodeURIComponent(this.href)) + "%26description%3D" + encodeURIComponent(encodeURIComponent($('title').html())) + "%26media%3D" + encodeURIComponent(encodeURIComponent('http://urbanqee.com/webutil/photo/fancybox/demo/people/girl-pixabay-03.jpg')) + '\',' + '\'social_window\',\'width=600,height=600,resizable=yes,scrollbars=yes,toolbar=yes\')">';
                //Evernote clip
                this.title += '<img src="http://urbanqee.com/webutil/photo/lightbox290/images/evernote.png" width=32 height=32 title="このページの情報を Evernote で共有する" style="cursor: pointer;margin-right:5px;"';
                this.title += ' onclick="window.open(\'https://www.evernote.com/clip.action?url=' + encodeURIComponent(this.href) + '&title=' + encodeURIComponent($('title').html()) + '\',' + '\'social_window\',\'width=700,height=600,resizable=yes,scrollbars=yes,toolbar=yes\')">';
                // 14.RSS
                this.title += '<img src="http://urbanqee.com/webutil/photo/lightbox290/images/rss-Feed-icon_svg.png" width=32 height=32 title="このページの情報を RSS で共有する" style="cursor: pointer;margin-right:5px;"';
                this.title += ' onclick="window.open(\'http://rssblog.ameba.jp/ske48official/rss20.xml' + '\',' + '\'social_window\',\'width=700,height=600,resizable=yes,scrollbars=yes,toolbar=yes\')">';

            }
        },
        afterShow: function() {
         // Render tweet button twttr.widgets.load(); http://qiita.com/kzhrk/items/5bc39df48dc1ab8ea850
         if (typeof twttr === 'undefined') {
          var twitterjs = document.createElement("script");
          twitterjs.async = true;
          twitterjs.src = '//platform.twitter.com/widgets.js';
          document.getElementsByTagName('body')[0].appendChild(twitterjs);
          }
         else {
          twttr.widgets.load();
          }

         // Render Facebook
         if(typeof FB === 'undefined'){
          $('body').append('<div id="fb-root"></div>');
          var fbjs = document.createElement('script');
          fbjs.id = 'facebook-jssdk';
          fbjs.src = '//connect.facebook.net/ja_JP/all.js#xfbml=1&appId={Facebook App ID}';
          document.getElementsByTagName('body')[0].appendChild(fbjs);
         }else{
          FB.XFBML.parse();
          }
        },
        helpers : {
            title : {
                type: 'inside'
            }
        }
  });

});

</script> 
  

<p>
<a title="庭の風景１" class="fancybox" href="flower/P5300012.jpg"><img src="flower/P5300012.jpg" width=150 height=150/></a>
<a title="庭の風景２" class="fancybox" href="P5310024.jpg"><img src="P5310024.jpg" alt="" width=150 height=150 /></a>
<a title="庭の風景３" class="fancybox" href="P5300009.jpg"><img src="P5300009.jpg" alt="" width=150 height=150 /></a>
</p>