https://www.amanofd.jp/common/js/common.js

1jQuery(document).ready(function($){
2  var winW = window.innerWidth ? window.innerWidth: $(window).width();
3  var winH = window.innerHeight ? window.innerHeight: $(window).height();
4  var spBP = 640
5
6  /**** 文字サイズを切り替える ****/
7
8  // 文字サイズ：基準値設定
9  var fontSizeL = 14;
10  var bodyElm = $('body');
11  var fontSizeList = $('#header-fontsize-btn li');
12  var cookie;
13
14  // ページ読み込み時クッキー取得
15  if ($.cookie('fontSize')) {
16    cookie = $.cookie('fontSize');
17    if (cookie === 'fontSizeFlgL') {
18      bodyElm.css({ 'font-size': fontSizeL });
19      //カレント設定
20      fontSizeList.removeClass('fontsize-current');
21      $('#fontsize-l').addClass('fontsize-current');
22    }
23  }
24
25  // 文字サイズ：ボタンクリック
26  fontSizeList.on('click', function(e) {
27    e.preventDefault();
28    var thisList = $(this);
29    // カレント設定
30    fontSizeList.removeClass('fontsize-current');
31    thisList.addClass('fontsize-current');
32
33    // 標準をクリック
34    if (thisList.hasClass('fontsize-m')) {
35      //フォントサイズリセット
36      bodyElm.removeAttr('style');
37      //クッキーリセット
38      $.removeCookie('fontSize');
39
40    // 大をクリック
41    } else if (thisList.hasClass('fontsize-l')) {
42      // フォントサイズ大設定
43      bodyElm.css({ 'font-size': fontSizeL });
44      // クッキー生成
45      $.cookie('fontSize', 'fontSizeFlgL', { expires: 365 });
46    }
47  });
48
49  // 文字サイズ：spレイアウト時は設定をリセット
50  $(window).on('resize orientationchange', function() {
51    var winW = window.innerWidth ? window.innerWidth: $(window).width();
52    if ( winW < Number(spBP + 1) ) {
53
54      // フォントサイズリセット
55      bodyElm.removeAttr('style');
56      fontSizeList.removeClass('fontsize-current');
57      $('#fontsize-m').addClass('fontsize-current');
58
59      // 大が選択されていた場合クッキーリセット
60      if ($.cookie('fontSizeL')) {
61        $.removeCookie('fontSizeL');
62      }
63    }
64  });
65
66
67  /**** グローバルナビのカレントを制御 ****/
68
69  // ヘッダーグローバルナビのリンク先の1つ目のディレクト名と各ページの1つ目のディレクト名でマッチさせる。
70  if (location.pathname != "/") {
71    // トップページ以外はナビのリンク先の1つ目のディレクトリ名とURLの1つ目のディレクトリ名がマッチすればカレントを付ける。
72    $('#header-menu li a[href^="/' + location.pathname.split("/")[1] + '"]').parent('li').addClass('menu-current');
73  } else {
74    // トップページだったら任意のナビにカレントを付ける。※ :eq(0)は1番目のナビ
75    //20191106更新
76    $('#header-menu li a:eq(0)').parent('li').addClass('menu-current');
77  }
78  // ※ナビのリンクに無いディレクトリのページでもナビにカレントを必要とする場合の対処
79  // 第一階層のディレクト名でマッチさせる：http://www.hoge.com/dirname/
80  var dirName1 = location.pathname.split("/")[1];
81  if ( dirName1.match('products') ) {
82    var dirName2 = location.pathname.split("/")[2];
83    //lctn_と一致した場合、カレント
84    if ( dirName2.match('lctn_.*') ) {
85      $('#header-menu-04').addClass('menu-current');
86      $('#header-menu-05').removeClass('menu-current'); //医薬品
87      $('#header-menu-11').removeClass('menu-current'); //ディアナチュラ
88    }
89
90    //アサヒの健康通販の商品URLを配列へ格納
91    var products_asahi = ['100koubo','nokogiri','gluco','gluco_ex','g_karyu','aojiru30','aozakana','maca','nokogiriyashi','ukon','blueberry','ringo','hiacolla','collaB','lute'];
92
93    for (var i=0; i<products_asahi.length;i++){
94
95      //配列の値と一致した場合、カレント
96      if ( dirName2.match(products_asahi[i] + '.*') ) {
97        $('#header-menu-03').addClass('menu-current');
98        $('#header-menu-05').removeClass('menu-current'); //医薬品
99        $('#header-menu-11').removeClass('menu-current'); //ディアナチュラ
100      }
101
102    }
103
104    //カルピス健康通販の商品URLを配列へ格納
105    var products_calpis = ['l92_tab','akodomo','atencha','ceramide','l92_drink','l92_powder','

105shinayaka','shinayaka_ctc','shinayaka_epadha','lactowell','onaka','biomine','kotsucare','biomine_c','c23_tab','msccare','cs19','locotomo','petlabo_dog','lpscare','aojiru','menekipplus','watapro'];
106
107    for (var i=0; i<products_calpis.length;i++){
108      //配列の値と一致した場合、カレント
109      if ( dirName2.match(products_calpis[i] + '.*') ) {
110        $('#header-menu-02').addClass('menu-current');
111        $('#header-menu-05').removeClass('menu-current'); //医薬品
112        $('#header-menu-11').removeClass('menu-current'); //ディアナチュラ
113      }
114    }
115
116    //医薬品
117    var products_med = ['touki','gosha'];
118
119    for (var i=0; i<products_med.length;i++){
120      //配列の値と一致した場合、カレント
121      if ( dirName2.match(products_med[i] + '.*') ) {
122        $('#header-menu-05').addClass('menu-current');
123        $('#header-menu-11').removeClass('menu-current'); //ディアナチュラ
124      }
125    }
126  }
127
128  /**** ウィンドウ画面サイズに応じた動作 ****/
129
130  $(window).on('load resize orientationchange', function() {
131    var winW = window.innerWidth ? window.innerWidth: $(window).width();
132
133    /**** SPメニューを制御 ****/
134
135    if ( winW < Number(spBP + 1) ) {
136      // 各種切り替えのリセット（iOSの scroll = resize になる仕様への対処）
137      if ( !$('#header-menu-wrap').hasClass('menu-open-active') ) {
138        $('#header-menu-wrap').hide();
139      }
140      //#header-menu-sp-openでSPメニューを開く
141      $('#header-menu-sp-open a').on('click', function() {
142        $('#header-menu-wrap').slideDown();
143        $('#header-menu-wrap').addClass('menu-open-active');
144        return false;
145      });
146      //#header-menu-sp-closeでSPメニューを閉じる
147      $('#header-menu-sp-close a').on('click', function() {
148        $('#header-menu-wrap').slideUp();
149        $('#header-menu-wrap').removeClass('menu-open-active');
150        return false;
151      });
152    } else {
153      // 各種切り替えのリセット
154      $('#header-menu-wrap').show();
155    }
156
157
158    /**** #up-btnの位置を入れ替え ****/
159
160    if ( winW < Number(spBP + 1) ) {
161      $( '#up-btn' ).appendTo( '#main-cont-01' );
162    } else {
163      $( '#up-btn' ).appendTo( '#footer-wrap' );
164    }
165
166
167    /**** OS判定に応じた動作 ****/
168
169    // モバイルOSの場合
170    if (
171      navigator.userAgent.indexOf('Android') > 0
172      || navigator.userAgent.indexOf('iPhone') > 0
173      || navigator.userAgent.indexOf('iPod') > 0
174      || navigator.userAgent.indexOf('iPad') > 0
175      || navigator.userAgent.indexOf('Windows Phone') > 0
176      || navigator.userAgent.indexOf('Windows Touch') > 0
177      || navigator.userAgent.indexOf('Mobile') > 0
178      || navigator.userAgent.indexOf('Tablet') > 0
179      || navigator.userAgent.indexOf('BlackBerry') > 0
180    ) {
181
182    // PCの場合
183    } else {
184      // マウスオーバー効果
185      $('a').addClass('mouse-over');
186
187      if ( winW < Number(spBP + 1) ) {
188        // 各種切り替えのリセット
189        $('#header-menu-02-wrap').hide();
190        $('#header-search-wrap').hide();
191      } else {
192        // 各種切り替えのリセット
193      }
194    }
195
196  });
197
198
199  /**** お問い合わせ　モーダルの表示 ****/
200
201  $(function(){
202      $('#header-menu-contact-open').on('click',function(){
203          $('#contact-modal').fadeIn();
204          return false;
205      });
206      $('.contact-modal-close').on('click',function(){
207          $('#contact-modal').fadeOut();
208          return false;
209      });
210  });
211
212
213  /**** ページトップボタンの動作とスムーススクロール ****/
214
215  // ページトップボタンフェードイン
216  var pageTopBtn = $('#up-btn');
217  // ページロード時にボタンを非表示
218  pageTopBtn.hide();
219  // 画面をスクロールした場合
220  $(window).on('load scroll orientationchange resize', function () {
221    var winW = window.innerWidth ? window.innerWidth: $(window).width();
222    var winH = window.innerHeight ? window.innerHeight: $(window).height();
223    var winHalf = Number(winH)/2;
224    var scrollTop = $(this).scrollTop();
225    // スクロールが画面上部から画面の半分スクロールした場合ボタンを表示
226    if ( scrollTop > winHalf ) {
227      pageTopBtn.fadeIn();
228      // スクロールが「footer」の位置より上に移動した場合ボタン追従を再始動
229      pageTopBtn.removeClass('stop');
230    } else {
231      pageTopBtn.fadeOut();
232    }
233    var fix = $('#main-cont-01');
234    var fixBottom = fix.height();
235    var BtnTop = pageTopBtn.offset().top;
236    // スクロールが「footer」の位置に達した場合ボタン追従を停止
237    if ( BtnTop >= fixBottom ) {
238      pageTopBtn.addClass('stop');
239    }
240  });
241
242  // 親要素がclass="smooth"の<a>タグをクリックした場合の処理
243  $('.smooth a').click(function() {
244    // スクロールの速度
245    var speed = 500; // ミリ秒
246    // アンカーの値取得
247    var href = $(this).attr("href");
248    // 移動先を取得
249    var target = $(href == "#" || href == "" ? 'html' : href);
250    // 移動先を数値で取得
251    var position = target.offset().top;
252    // スムーススクロール
253    $('html, body').animate({ scrollTop: position }, speed, 'swing');
254    return false;

255  });
256
257
258});
259
260
261
262
263
264