https://binakoko.com/wp/wp-content/themes/simplicity/javascript.js

1/////////////////////////////////
2//TOPへ戻るボタン
3/////////////////////////////////
4jQuery(function(){
5  jQuery(window).scroll(function(){
6    //最上部から現在位置までの距離を取得して、変数[now]に格納
7    var now = jQuery(window).scrollTop();
8    //最上部から現在位置までの距離(now)が600以上
9    if(now > 600){
10      //[#page-top]をゆっくりフェードインする
11      jQuery('#page-top').fadeIn('slow');
12      //それ以外だったらフェードアウトする
13    }else{
14      jQuery('#page-top').fadeOut('slow');
15    }
16    //console.log(wrapperTop);
17  });
18  //ボタン(id:move-page-top)のクリックイベント
19  jQuery('#move-page-top').click(function(){
20  //ページトップへ移動する
21    jQuery('body,html').animate({
22            scrollTop: 0
23        }, 800);
24  });
25});
26
27/////////////////////////////////
28//スクロール追従
29/////////////////////////////////
30var wrapperTop;//追従エリアのトップ位置を格納（追従開始位置
31var wrapperHeight;//追従エリアの高さを格納
32var sidebarHeight;//サイドバーの高さを格納
33
34//非同期ブログパーツがあっても追従開始位置がずれないように修正（無理やり）
35//スマートな良い方法があれば、ご教授お願いします。
36function getScrollAreaSettings(){
37  wrapperHeight = jQuery('#sidebar-scroll').outerHeight();
38  sidebarHeight = jQuery('#sidebar').outerHeight();
39  wrapperTop = sidebarHeight - wrapperHeight + 240;
40}
41setInterval('getScrollAreaSettings()',2000);
42
43(function(jquery) {
44  jquery(document).ready(function() {
45    /*
46    Ads Sidewinder
47    by Hamachiya2. http://d.hatena.ne.jp/Hamachiya2/20120820/adsense_sidewinder
48    */
49    var main = jQuery('#main'); // メインカラムのID
50    var side = jQuery('#sidebar'); // サイドバーのID
51    var wrapper = jQuery('#sidebar-scroll'); // スクロール追従要素のID
52    var side_top_margin = 60;
53    if (!wrapper.size()) {return;}//スクロール追従エリアにウイジェットが入っていないときはスルー
54    if (side.css('clear') == 'both') {return;}//レスポンシブでサイドバーをページ下に表示しているときはスルー
55
56    if (main.length === 0 || side.length === 0 || wrapper.length === 0) {
57      return;
58    }
59
60    var w = jquery(window);
61    wrapperHeight = wrapper.outerHeight();
62    wrapperTop = wrapper.offset().top;//とりあえずドキュメントを読み込んだ時点でスクロール追従領域の

62高さを取得
63    var sideLeft = side.offset().left;
64    //console.log(wrapperTop);
65
66    var sideMargin = {
67      top: side.css('margin-top') ? side.css('margin-top') : 0,
68      right: side.css('margin-right') ? side.css('margin-right') : 0,
69      bottom: side.css('margin-bottom') ? side.css('margin-bottom') : 0,
70      left: side.css('margin-left') ? side.css('margin-left') : 0
71    };
72
73    var winLeft;
74    var pos;
75
76    var scrollAdjust = function() {
77      sideHeight = side.outerHeight();
78      mainHeight = main.outerHeight();
79      mainAbs = main.offset().top + mainHeight;
80      var winTop = w.scrollTop()+side_top_margin;
81      winLeft = w.scrollLeft();
82      var winHeight = w.height();
83      var nf = (winTop > wrapperTop) && (mainHeight > sideHeight) ? true : false;
84      pos = !nf ? 'static' : (winTop + wrapperHeight) > mainAbs ? 'absolute' : 'fixed';
85      if (pos === 'fixed') {
86        side.css({
87          position: pos,
88          top: '',
89          bottom: winHeight - wrapperHeight,
90          left: sideLeft - winLeft,
91          margin: 0,
92          marginBottom: '-'+side_top_margin+'px'
93        });
94
95      } else if (pos === 'absolute') {
96        side.css({
97          position: pos,
98          top: mainAbs - sideHeight,
99          bottom: '',
100          left: sideLeft,
101          margin: 0,
102          marginBottom: '-'+side_top_margin+'px'
103        });
104
105      } else {
106        side.css({
107          position: pos,
108          marginTop: sideMargin.top,
109          marginRight: sideMargin.right,
110          marginBottom: sideMargin.bottom,
111          marginLeft: sideMargin.left
112        });
113      }
114    };
115
116    var resizeAdjust = function() {
117      side.css({
118        position:'static',
119        marginTop: sideMargin.top,
120        marginRight: sideMargin.right,
121        marginBottom: sideMargin.bottom,
122        marginLeft: sideMargin.left
123      });
124      sideLeft = side.offset().left;
125      winLeft = w.scrollLeft();
126      if (pos === 'fixed') {
127        side.css({
128          position: pos,
129          left: sideLeft - winLeft,
130          margin: 0,
131          marginBottom: '-'+side_top_margin+'px'
132        });
133
134      } else if (pos === 'absolute') {
135        side.css({
136          position: pos,
137          left: sideLeft,
138          margin: 0,
139          marginBottom: '-'+side_top_margin+'px'
140        });
141      }
142    };
143    w.on('load', scrollAdjust);
144    w.on('scroll', scrollAdjust);
145    w.on('resize', resizeAdjust);
146  });
147})(jQuery);
148
149/////////////////////////////////
150// メニューボタンの開閉
151/////////////////////////////////
152jQuery(document).ready(function() {
153  jQuery('#mobile-menu-toggle').click(function(){
154    header_menu = jQuery('#navi ul');
155    if (header_menu.css('display') == 'none') {
156      header_menu.slideDown();
157    } else{
158      header_menu.slideUp();
159    };
160  });
161
162});
163
164///////////////////////////////////
165// ソーシャルボタンカウントの非同期取得
166///////////////////////////////////
167jQuery(function(){
168  jQuery(window).scroll(function(){
169    //console.log(jQuery('#sidebar').css('clear'));
170    //最上部から現在位置までの距離を取得して、変数[now]に格納
171    var now = jQuery(window).scrollTop();
172    var sharebar = jQuery('#sharebar');
173    if (!sharebar.size()) {return;}
174    var main = jQuery('#main');
175    var sharebar_top = sharebar.offset().top;
176    var sharebar_h = sharebar.outerHeight();
177    var main_top = main.offset().top;
178    var main_h = main.outerHeight();
179
180    var bottom_line = main_h-400;
181    if(now < (main_h-sharebar_h)){
182      if (now > main_top) {
183        //sharebar.fadeIn('fast');
184        sharebar.css({
185          position: 'fixed',
186          top: '70px'
187        });
188      } else{
189        sharebar.css({
190          position: 'absolute',
191            top: main_top+70
192        });
193      };
194    }else{
195      //sharebar.fadeOut('fast');
196      sharebar.css({
197        position: 'absolute',
198        top: main_h-sharebar_h
199      });
200    }
201    //console.log(sharebar_h);
202
203  });
204});
205
206// Twitterのシェア数を取得
207function fetch_twitter_count(url, selector) {
208  jQuery.ajax({
209    url:'//urls.api.twitter.com/1/urls/count.json',
210    dataType:'jsonp',
211    timeout: 10000, //10sec
212    data:{
213      url:url
214    }
215  }).done(function(res){

216    jQuery( selector ).text( res.count || 0 );
217  }).fail(function(){
218    jQuery( selector ).html('<span class="fa fa-exclamation"></span>');
219  });
220}
221// function fetch_twitter_count(url, selector) {
222//   jQuery.ajax({
223//     url:'//urls.api.twitter.com/1/urls/count.json',
224//     dataType:'jsonp',
225//     timeout: 10000, //10sec
226//     data:{
227//       url:url
228//   },
229//   success:function(res){
230//     jQuery( selector ).text( res.count || 0 );
231//   },
232//   error:function(){
233//     jQuery( selector ).html('<span class="fa fa-exclamation"></span>');
234//   }
235//   });
236// }
237
238//Facebookのシェア数を取得
239function fetch_facebook_count(url, selector) {
240    jQuery.ajax({
241      url:'https://graph.facebook.com/',
242      dataType:'jsonp',
243      timeout: 10000, //10sec
244      data:{ id:url }
245    }).done(function(res){
246      jQuery( selector ).text( res.shares || 0 );
247    }).fail(function(){
248      jQuery( selector ).html('<span class="fa fa-exclamation"></span>');
249    });
250}
251// function fetch_facebook_count(url, selector) {
252//   jQuery.ajax({
253//     url:'https://graph.facebook.com/',
254//     dataType:'jsonp',
255//     timeout: 10000, //10sec
256//     data:{
257//       id:url
258//     },
259//     success:function(res){
260//       jQuery( selector ).text( res.shares || 0 );
261//     },
262//     error:function(){
263//       jQuery( selector ).html('<span class="fa fa-exclamation"></span>');
264//     }
265//   });
266// }
267
268//Google＋のシェア数を取得
269function fetch_google_plus_count(url, selector) {
270  jQuery.ajax({
271    url: social_count_config.theme_url+'/lib/fetch-google-plus.php?url='+url,
272    dataType:'text',
273    timeout: 10000, //10sec
274  }).done(function(res){
275    jQuery( selector ).text( res || 0 );
276  }).fail(function(){
277    jQuery( selector ).html('<span class="fa fa-exclamation"></span>');
278  });
279}
280
281// function fetch_google_plus_count(url, selector) {
282//   jQuery.ajax({
283//     url: social_count_config.theme_url+'/lib/fetch-google-plus.php?url='+url,
284//     dataType:'text',
285//     timeout: 10000, //10sec
286//     success:function(res){
287//       jQuery( selector ).text( res || 0 );
288//     },
289//     error:function(){
290//       jQuery( selector ).html('<span class="fa fa-exclamation"></span>');
291//     }
292//   });
293//   // jQuery.ajax({
294//   //   type: "get", dataType: "xml",
295//   //   url: "//query.yahooapis.com/v1/public/yql",
296//   //   data: {
297//   //     q: "SELECT content FROM data.headers WHERE url='https://plusone.google.com/_/+1/fastbutton?hl=ja&url=" + url + "' and ua='#Mozilla/5.0 (Windows NT 6.1; WOW64) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/33.0.1750.154 Safari/537.36'",
298//   //     format: "xml",
299//   //     env: "http://datatables.org/alltables.env"
300//   //   },
301//   //   success: function (data) {
302//   //     var content = jQuery(data).find("content").text();
303//   //     var match = content.match(/window\.__SSR[\s*]=[\s*]{c:[\s*](\d+)/i);
304//   //     var count = (match != null) ? match[1] : 0;
305
306//   //     jQuery( selector ).text(count);
307//   //   }
308//   // });
309// }
310
311//はてなブックマークではてブ数を取得
312function fetch_hatebu_count(url, selector) {
313  jQuery.ajax({
314    url:'//api.b.st-hatena.com/entry.count?callback=?',
315    dataType:'jsonp',
316    timeout: 10000, //10sec
317    data:{
318      url:url
319    }
320  }).done(function(res){
321    jQuery( selector ).text( res || 0 );
322  }).fail(function(){
323    jQuery( selector ).html('<span class="fa fa-exclamation"></span>');
324  });
325}
326// //はてなブックマークではてブ数を取得
327// function fetch_hatebu_count(url, selector) {
328//   jQuery.ajax({
329//     url:'//api.b.st-hatena.com/entry.count?callback=?',
330//     dataType:'jsonp',
331//     timeout: 10000, //10sec
332//     data:{
333//       url:url
334//     },
335//     success:function(res){
336//       jQuery( selector ).text( res || 0 );
337//     },
338//     error:function(){
339//       jQuery( selector ).html('<span class="fa fa-exclamation"></span>');
340//     }
341//   });
342// }
343
344//ポケットのストック数を取得
345function fetch_pocket_count(url, selector) {
346  jQuery.ajax({
347    url: social_count_config.theme_url+'/lib/fetch-pocket.php?url='+url,
348    dataType:'text',
349    timeout: 10000, //10sec
350  }).done(function(res){

351    jQuery( selector ).text( res || 0 );
352  }).fail(function(){
353    jQuery( selector ).html('<span class="fa fa-exclamation"></span>');
354  });
355}
356// function fetch_pocket_count(url, selector) {
357//   jQuery.ajax({
358//     url: social_count_config.theme_url+'/lib/fetch-pocket.php?url='+url,
359//     dataType:'text',
360//     timeout: 10000, //10sec
361//     success:function(res){
362//       jQuery( selector ).text( res || 0 );
363//     },
364//     error:function(){
365//       jQuery( selector ).html('<span class="fa fa-exclamation"></span>');
366//     }
367//   });
368//   // jQuery.ajax({
369//   //   type: "get", dataType: "xml",
370//   //   url: "//query.yahooapis.com/v1/public/yql",
371//   //   data: {
372//   //     q: "SELECT content FROM data.headers WHERE url='https://widgets.getpocket.com/v1/button?label=pocket&count=vertical&v=1&url=" + url + "' and ua='#Mozilla/5.0 (Windows NT 6.1; WOW64) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/33.0.1750.154 Safari/537.36'",
373//   //     format: "xml",
374//   //     env: "http://datatables.org/alltables.env"
375//   //   },
376//   //   success: function (data) {
377//   //     var content = jQuery(data).find("content").text();
378//   //     var match = content.match(/<em id="cnt">(\d+)<\/em>/i);
379//   //     var count = (match != null) ? match[1] : 0;
380
381//   //     jQuery( selector ).text(count);
382//   //   }
383//   // });
384// }
385
386//feedlyの購読者数を取得
387function fetch_feedly_count(rss_url, selector) {
388  jQuery.ajax({
389    url: social_count_config.theme_url+'/lib/fetch-feedly.php?url='+rss_url,
390    dataType:'text',
391    timeout: 10000, //10sec
392  }).done(function(res){
393    jQuery( selector ).text( res || 0 );
394  }).fail(function(){
395    jQuery( selector ).html('<span class="fa fa-exclamation"></span>');
396  });
397}
398// function fetch_feedly_count(rss_url, selector) {
399//   jQuery.ajax({
400//     url: social_count_config.theme_url+'/lib/fetch-feedly.php?url='+rss_url,
401//     dataType:'text',
402//     timeout: 10000, //10sec
403//     success:function(res){
404//       //console.log(res);
405//       jQuery( selector ).text( res || 0 );
406//     },
407//     error:function(){
408//       jQuery( selector ).html('<span class="fa fa-exclamation"></span>');
409//     }
410//   });
411// }
412
413function doMasonry() {
414  jQuery('#list').masonry({ //<!-- #listは記事一覧を囲んでる部分 -->
415    itemSelector: '.entry', //<!--.entryは各記事を囲んでる部分-->
416    isAnimated: true //<!--アニメーションON-->
417  });
418}
419
420jQuery(function(){
421  if (typeof social_count_config !== 'undefined') {
422    //console.log(social_count_config.all_sns_share_btns_visible);
423    //シェアボタンを全部表示しているとき
424    if ( social_count_config.all_sns_share_btns_visible &&
425         social_count_config.all_share_count_visible ) {
426
427      //Twitterカウントの取得
428      if ( social_count_config.twitter_btn_visible )
429        fetch_twitter_count(social_count_config.permalink, '.twitter-count');
430      //Facebookカウントの取得
431      if ( social_count_config.facebook_btn_visible )
432        fetch_facebook_count(social_count_config.permalink, '.facebook-count');
433      //Google＋カウントの取得
434      if ( social_count_config.google_plus_btn_visible )
435        fetch_google_plus_count(social_count_config.permalink, '.googleplus-count');
436      //はてブカウントの取得
437      if ( social_count_config.hatena_btn_visible )
438        fetch_hatebu_count(social_count_config.permalink, '.hatebu-count');
439      //Pocketカウントの取得
440      if ( social_count_config.pocket_btn_visible )
441        fetch_pocket_count(social_count_config.permalink, '.pocket-count');
442      //feedlyカウントの取得
443      if ( social_count_config.feedly_btn_visible )
444        fetch_feedly_count(social_count_config.rss2_url, '.feedly-count');
445
446    };
447
448  }
449
450  if (typeof lazyload_config !== 'undefined') {
451    jQuery('img').lazyload(lazyload_config);
452  }
453});
454
455jQuery(window).load(function(){
456  if (typeof do_masonry !== 'undefined') {
457    doMasonry()
458  }
459});
460jQuery(function(){
461  if (typeof do_masonry !== 'undefined') {
462    doMasonry()
463  }
464});
465
466///////////////////////////////////

467// レスポンス表示時のメニューの挙動
468// メニューのスタイル表示崩れの防止
469///////////////////////////////////
470jQuery(function(){
471  jQuery(window).resize(function(){
472    if ( jQuery(window).width() > 1110 ) {
473      jQuery('#navi-in ul').removeAttr('style');
474    };
475  });
476});
477
478///////////////////////////////////
479// Facebookページいいねエリアのリサイズ（Androidブラウザ対応用）
480///////////////////////////////////
481function adjast_article_like_arrow_box() {
482  var w = jQuery('#main').width();
483  jQuery('#main .article-like-arrow-box').css('width', (w - 114) + 'px');
484  var w = jQuery('#sidebar').width();
485  jQuery('#sidebar .article-like-arrow-box').css('width', (w - 114) + 'px');
486  //console.log(w);
487}
488jQuery(window).resize(function() {
489  adjast_article_like_arrow_box()
490});
491
492jQuery(document).ready(function() {
493  adjast_article_like_arrow_box()
494});
495