wpe-exp/exp

SNS シェアボタンのデザイン改修

Closed this issue · 1 comments

sns.js

以下は Facebook のカウント数取得の記述

fbCount: function() {
    var pageURL = location.href;
    pageURL = encodeURIComponent(pageURL);
    url = 'http://graph.facebook.com/?id=' + pageURL;
    $.ajax({
      url: url,
      dataType: 'jsonp',
      success: function(json) {
        var count;
        count = json.shares ? json.shares : 0;
        $('#main').find('.snsShare__count--fb').html(count);
      }
    });
  },
  fbOpen: function() {
    var $target = $('#main').find('.snsShare__btnFb');
    $target.on('click', function(event) {
      event.preventDefault();
      window.open($(this).attr('href'), 'facebook', 'width=670, height=400, menubar=no, toolbar=no, scrollbars=yes');
    });
  },

カレントページの url 取得は一行でまとめる

 var url =  'http://graph.facebook.com/?id=' + encodeURIComponent(location.href);

var count 以下も一行にまとめる

var count = json.shares ? json.shares:0;

はてブ、Twitter の記述も同様にしてリファクタ

_module-sns.scss

Twitter のカウント数をホバーした時にアンダーラインが triangle に隠れてしまうので、z-index で調整する

Twitter がカウント数表示に非対応となったのでボタンのデザイン改修