https://otake-cl.com/js/jQ.js

1// JavaScript Document
2
3
4// Global ----------------------------------------
5
6var windowWidth = $(window).width();
7var windowSm = 768; // ブレイクポイント
8
9
10// 電話番号 ----------------------------------------
11
12if (navigator.userAgent.match(/(iPhone|iPad|Android|Mobile)/)) {
13  $('.js-tel').each(function() {
14    var str = $(this).html();
15
16    if ($(this).children().is('img')) {
17
18      $(this).html(
19        $('<a>')
20          .attr('href', 'tel:' + $(this).children().attr('alt').replace(/-/g, ''))
21          .attr('onclick', "return gtag_report_conversion(undefined, 'AW-17879227334/Rd1rCJWyqLAcEMa3vc1C');")
22          .append(str)
23      );
24
25    } else {
26
27      $(this).html(
28        $('<a>')
29          .attr('href', 'tel:' + $(this).text().replace(/-/g, ''))
30          .attr('onclick', "return gtag_report_conversion(undefined, 'AW-17879227334/Rd1rCJWyqLAcEMa3vc1C');")
31          .append(str)
32      );
33
34    }
35  });
36}
37// トリガーで出てくる要素 ----------------------------------------
38
39//$(window).on('scroll load', function(){
40//  $('.anime').each(function(){
41//    var imgPos = $(this).offset().top;
42//    var scroll = $(window).scrollTop();
43//    var windowHeight = $(window).height();
44//    if (scroll > imgPos - windowHeight + windowHeight/5){
45//      $(this).addClass('trigger')
46//    }
47//  });
48//});
49
50
51// Gナビ ----------------------------------------
52
53$('#nav #sp_menu').click(function() { // SPハンバーガーモーダル
54  $('html, body').toggleClass('spnav_modal');
55  $(this).toggleClass('close').next('#nav .gnav_subnav').css('visibility','visible').fadeToggle(200);
56  $('#nav #sp_menu').not($(this)).removeClass('close').next('#nav .gnav_subnav').css('display','none');
57  return false;
58});
59$('#nav .sub').click(function() { // 診療内容ドロップダウンメニュー
60  $(this).toggleClass('close').next('#nav .subbox').css('visibility','visible').slideToggle();
61  $('#nav .sub').not($(this)).removeClass('close').next('#nav .subbox').css('display','none');
62  return false;
63});
64$(window).click(function(e) { // エリア外タップでモーダル閉じる
65  if ($('.spnav_modal').is(':visible')) {
66    if(!$(e.target).closest('#nav .gnav_subnav').length) { // タブレット対応
67      $('html, body').removeClass('spnav_modal');
68      $('#nav #sp_menu').removeClass('close');
69      $('#nav .gnav_subnav').fadeToggle();
70    }
71  }
72});
73
74// PCの場合
75 if (windowWidth >= windowSm) {
76 //診療内容処理
77   $(window).click(function(e) { // エリア外タップでモーダル閉じる
78     if ($('#nav .subbox').is(':visible')) {
79       if(!$(e.target).closest('#nav').length) { // タブレット対応
80        $('#nav .sub').removeClass('close');
81       $('#nav .subbox').slideUp(150);
82      }
83    }
84  });
85}
86
87// カレントメニュー処理
88if (windowWidth >= windowSm) { // PCの場合
89  $('#nav .current').removeClass('current');
90  $('#nav a').filter(function(){
91    return $(this).prop('href')==location.href;
92  }).addClass('current');
93}
94
95// gnav 固定 ----------------------------------------
96if (windowWidth >= windowSm) { // PCの場合
97  const headNav = $('#nav');
98  $(window).scroll(function () {
99    if($(this).scrollTop() > 300 && headNav.hasClass('fixed') == false) {
100      headNav.css({top: '-100px'});
101      headNav.addClass('fixed');
102      headNav.animate({top: 0},1000);
103    }
104    // スクロール量が300px以下かつクラスfixedが付与されているとき
105    else if($(this).scrollTop() < 300 && headNav.hasClass('fixed') == true){
106      // クラスfixedを外す
107      headNav.removeClass('fixed');
108    }
109  });
110}
111
112
113// トップ キービジュアル slick ----------------------------------------
114$('#keyvsl').slick({
115  cssEase: 'linear', // 一定速度
116  autoplay: true, // Autoplay
117  autoplaySpeed: 5000, // インターバル
118  speed: 700, // 切替時間
119  arrows: false, // Prev/Next
120  dots: false, // インジケーター
121  fade: true
122});
123$('#keyvsl').delay(50).css('visibility','visible');
124
125// トップ お知らせ アコーディオン ----------------------------------------
126
127$('.news_title').slice(0, 3).addClass('close'); // 最新3個は展開
128$('.news_title').click(function(){
129  $(this).toggleClass('close').next('.news_body').slideToggle();
130});
131
132// クリニック紹介ギャラリー slick ----------------------------------------
133
134$(".gallery_slider").each(function() { // メイン画像
135  $(this).slick({
136    cssEase: 'linear', // 一定速度
137//    autoplay: true, // Autoplay
138//    autoplaySpeed: 5000, // インターバル
139    dots: true, // インジケーター
140    fade: true,
141    speed: 500, // 切替時間

142    adaptiveHeight: true, // 内容によって高さ可変
143    asNavFor: "#" + $(this).attr("id") + "_nav" // 複数スライド対応
144  });
145});
146$(".gallery_thum").each(function() { // サムネ
147  $(this).slick({
148    slidesToShow: 7,
149    slidesToScroll: 1,
150    centerMode: true,
151    centerPadding: 0,
152    arrows: false, // Prev/Next
153    cssEase: 'linear', // 一定速度
154    focusOnSelect: true, // クリックで切り替え
155    asNavFor: "#" + $(this).attr("id").replace("_nav", ""), // 複数スライド対応
156    responsive: [{
157      breakpoint: 767, // スマホの場合
158      settings: {
159        slidesToShow: 3,
160      },},
161    ]
162  });
163});
164//$('.gallery_slider').on('beforeChange', function(event, slick, currentSlide, nextSlide){
165//  if ($('.gallery_thum > div').length < 4) { // 枚数が少ない場合の処理
166//      $('.gallery_thum').slick('slickSetOption', 'centerMode', true, true);
167//  }
168//});
169$('.gallery_slider, .gallery_thum').delay(50).css('visibility','visible');
170
171// ページ内リンク 外からの調整 スムーズスクロール ----------------------------------------
172
173var headerHeight = (windowWidth >= windowSm) ? 100 : 0;
174var urlHash = location.hash;
175if(urlHash) {
176    $('body,html').stop().scrollTop(0);
177    setTimeout(function(){
178        var target = $(urlHash);
179        var position = target.offset().top - headerHeight;
180        $('body,html').stop().animate({scrollTop:position}, 400);
181    }, 100);
182}
183$('a[href^="#"]').click(function() {
184    var href= $(this).attr("href");
185    var target = $(href);
186    var position = target.offset().top - headerHeight;
187    $('body,html').stop().animate({scrollTop:position}, 400);
188});
189
190
191// SPフッター固定　電話・WEb予約・ページアップ ----------------------------------------
192
193var f_fix = $('#tel_up').hide();
194$(window).scroll(function () {
195  if ($(this).scrollTop() > 200) {
196    f_fix.fadeIn().css('visibility', 'visible');
197  } else {
198    f_fix.fadeOut();
199  }
200});
201$('#pageup').click(function () {
202  $('html, body').animate({ scrollTop: 0 }, 500, 'swing');
203  return false;
204});
205
206
207//Q&A faq ----------------------------------------
208$(function() {
209  $('.faq_list dt').click(function(){
210    $(this).stop().toggleClass('active');
211    $(this).next('dd').stop().slideToggle();
212  })
213});