https://www.airi-dental.com/wp-content/themes/original_theme/assets/js/theme.js

1// vwをセット
2function setVw(){
3  var vw = jQuery(window).width() / 100 + 'px';
4  jQuery(':root').css('--vw', vw);
5}
6window.addEventListener( 'resize', function(){
7	setVw();
8});
9window.addEventListener( 'load', function(){
10  // body にクラス付与
11  jQuery('body').addClass('onload');
12  setVw();
13});
14
15jQuery(function($) {
16
17  //TOTOP
18  $(window).scroll(function () {
19    var TargetPos = 350;
20    var ScrollPos = $(window).scrollTop();
21    if (ScrollPos >= TargetPos) {
22      $("#totop").fadeIn();
23      $("#header").addClass('header_scrolled');
24    } else {
25      $("#totop").fadeOut();
26      $("#header").removeClass('header_scrolled');
27    }
28  });
29  $("#totop").click(function () {
30    $('body,html').animate({
31      scrollTop: 0
32    }, 500);
33    return false;
34  });
35
36  // FAQ
37  $('.box_faq .question').click(function () {
38    $(this).toggleClass('open');
39    $(this).next().slideToggle();
40  });
41
42  // 擬似スライダー画像切り替え
43
44  $(window).load(function () {
45    $('.slide_main .item').append('<div class="arrow-prev"></div><div class="arrow-next"></div>');
46  });
47
48  $('.slide_wrap .slide_main .item:first-child').addClass('active');
49  $('.slide_wrap .slide_thumb .item:first-child').addClass('thumbnail-current');
50  $('.slide_wrap .slide_thumb .item').on('click', function () {
51    $(this).siblings().removeClass('thumbnail-current');
52    $(this).addClass('thumbnail-current');
53    var index = $('.slide_wrap .slide_thumb .item').index(this); $(this).parent('.slide_thumb').siblings('.slide_main').children('.item').removeClass('active');
54    $('.slide_wrap .slide_main .item').eq(index).addClass('active');
55  });
56  $(document).on("click", ".arrow-prev", function () {
57    var parent = $(this).parent();
58    var index = $('.slide_wrap .slide_main .item').index(parent);
59    $(this).parent('.slide_wrap .slide_main .item').removeClass('active');
60    $(this).parent('.slide_wrap .slide_main .item').prev('.slide_wrap .slide_main .item').addClass('active');
61    $(this).parents('.slide_wrap .slide_main').siblings('.slide_thumb').children('.item').removeClass('thumbnail-current');
62    $('.slide_wrap .slide_thumb .item').eq(index - 1).addClass('thumbnail-current');
63  });
64  $(document).on("click", ".arrow-next", function () {
65    var parent = $(this).parent();
66    var index = $('.slide_wrap .slide_main .item').index(parent);
67    $(this).parent('.slide_wrap .slide_main .item').removeClass('active');
68    $(this).parent('.slide_wrap .slide_main .item').next('.slide_wrap .slide_main .item').addClass('active');
69    $(this).parents('.slide_wrap .slide_main').siblings('.slide_thumb').children('.item').removeClass('thumbnail-current');
70    $('.slide_wrap .slide_thumb .item').eq(index + 1).addClass('thumbnail-current');
71  });
72
73  // 汎用タブメニュー
74  $('.tab_btn').click(function () {
75    var tab_wrap = $(this).closest('.tab_wrap');
76    var tab_btn_item = $(tab_wrap).find('.tab_btn');
77    var index = $(tab_btn_item).index(this);
78
79    $(this).closest('.tab_btn_wrap').children('.tab_btn').removeClass('active');
80    $(this).closest('.tab_btn_wrap').next('.tab_item_wrap').children('.tab_item').removeClass('active');
81    $(this).addClass('active').addClass('moving');
82    $(this).closest('.tab_btn_wrap').next('.tab_item_wrap').children('.tab_item').eq(index).addClass('active');
83  });
84
85  //ユーザーエージェント判定
86  var userAgent = window.navigator.userAgent.toLowerCase();
87  if (userAgent.indexOf('ipad') != -1) {
88    $('body').addClass('ipad');
89  } else if (userAgent.indexOf('iphone') != -1) {
90    $('body').addClass('ios');
91  }
92
93  //360px以下はvewport固定
94  let viewport = document.querySelector('meta[name="viewport"]');
95
96  function switchViewport() {
97    let value =
98      window.innerWidth > 360
99      ? 'width=device-width'
100      : 'width=360';
101    if (viewport.getAttribute('content') !== value) {
102      viewport.setAttribute('content', value);
103    }
104  }
105
106  addEventListener('resize', switchViewport, false);
107  switchViewport();
108  
109});