https://www.saf.or.jp/js/custom_top.js

1$(function() {
2/*-----------------------------------------------------------------------------------*/
3
4/* ページトップへ戻る
5
6/*-----------------------------------------------------------------------------------*/
7    var windowWidth = $(window).width();
8    var windowSp = 767;
9    if (windowWidth <= windowSp) {
10        //SP
11        $(document).ready(function(){
12            $(".pagetop").hide();
13            $(window).on("scroll", function() {
14                if ($(this).scrollTop() > 100) {
15                    $(".pagetop").fadeIn("fast");
16                } else {
17                    $(".pagetop").fadeOut("fast");
18                }
19                scrollHeight = $(document).height(); //ドキュメントの高さ 
20                scrollPosition = $(window).height() + $(window).scrollTop(); //現在地 
21                footHeight = $(".footer").innerHeight(); //footerの高さ（＝止めたい位置）
22
23                //alert(footHeight);
24                if ( scrollHeight - scrollPosition  <= footHeight ) { //ドキュメントの高さと現在地の差がfooterの高さ以下になったら
25                    $(".pagetop").css({
26                        "position":"fixed", //pisitionをabsolute（親：wrapperからの絶対値）に変更
27                        "bottom": "30px" //下からfooterの高さ + 20px上げた位置に配置
28                    });
29                } else { //それ以外の場合は
30                    $(".pagetop").css({
31                        "position":"fixed", //固定表示
32                        "bottom": "30px" //下から20px上げた位置に
33                    });
34                }
35            });
36            $('.pagetop').click(function () {
37                $('body,html').animate({
38                scrollTop: 0
39                }, 400);
40                return false;
41            });
42        });
43
44    } else {
45
46        //PC
47        $(document).ready(function(){
48            $(".pagetop").hide();
49            $(window).on("scroll", function() {
50                if ($(this).scrollTop() > 150) {
51                    $(".pagetop").fadeIn("fast");
52                } else {
53                    $(".pagetop").fadeOut("fast");
54                }
55                scrollHeight = $(document).height(); //ドキュメントの高さ 
56                scrollPosition = $(window).height() + $(window).scrollTop(); //現在地 
57                footHeight = $(".footer").innerHeight(); //footerの高さ（＝止めたい位置）
58
59                //alert(footHeight);
60                if ( scrollHeight - scrollPosition  <= footHeight - 30 ) { //ドキュメントの高さと現在地の差がfooterの高さ以下になったら
61                    $(".pagetop").css({
62                        "position":"fixed", //pisitionをabsolute（親：wrapperからの絶対値）に変更
63                        "bottom": footHeight + 20 //下からfooterの高さ + 20px上げた位置に配置
64                    });
65                } else { //それ以外の場合は
66                    $(".pagetop").css({
67                        "position":"fixed", //固定表示
68                        "bottom": "20px" //下から20px上げた位置に
69                    });
70                }
71            });
72            $('.pagetop').click(function () {
73                $('body,html').animate({
74                scrollTop: 0
75                }, 400);
76                return false;
77            });
78        });
79
80    }
81
82
83/*-----------------------------------------------------------------------------------*/
84
85/* pagetopスムーススクロール
86
87/*-----------------------------------------------------------------------------------*/
88    $('.pagetop a').click(function () {
89        var speed = 500;
90        var href = $(this).attr("href");
91        var target = $(href == "#" || href == "" ? 'html' : href);
92        var position = target.offset().top;
93        $('body,html').animate({scrollTop:position}, speed, 'swing');
94        return false;
95    });
96
97
98/*-----------------------------------------------------------------------------------*/
99
100/* TEL番号切り替え
101
102/*-----------------------------------------------------------------------------------*/
103    var ua = navigator.userAgent;
104        if(ua.indexOf('iPhone') > 0 || ua.indexOf('Android') > 0){
105            $('.tel-link').each(function(){
106            var str = $(this).text();
107            $(this).html($('<a>').attr('href', 'tel:' + str.replace(/-/g, '')).append(str + '</a>'));
108        });
109    }
110
111
112/*-----------------------------------------------------------------------------------*/
113
114/* 高さ揃える
115
116/*-----------------------------------------------------------------------------------*/
117    $('.nav_inner .box03 li a').matchHeight();
118    $('.footer .sp_box01 li a').matchHeight();
119    $('.top_tab_news_area02 .title').matchHeight();
120    $('.information_tab_area_01 ul li').matchHeight();
121    $('#top_wrapper .block01 .box02 ul li a p').matchHeight();
122    $('#member_top .box03 ul li').matchHeight();
123    $('#member_support .box02 ul li').matchHeight();
124
125
126/*-----------------------------------------------------------------------------------*/
127
128/* header
129
130/*-----------------------------------------------------------------------------------*/
131    //PC search
132    $('.header .right_area #search .search_btn , .header .right_area #search .closebtn').on('click', function(){
133        $('.header .right_area #search .search_main').toggleClass('show');
134    });
135
136/*    //TAB,SP search
137    $('.search_btn img').on('click', function(){
138        $('.search_main').toggleClass('show');
139    });
140*/
141    //PCメガメニュー　ホバーで表示
142    $(".bottom_box li.nvbtn").hover(function(){
143        if($(this).hasClass('')){
144        } else {
145            $(this).addClass("box_open");
146            $(this).children('ul').css({'opacity':1});
147        }
148    }, function(){
149        $(this).removeClass("box_open");
150        $(this).children('ul').css({'opacity':0});
151    });
152
153    //ハンバーガーメニューボタン
154    body = $(document.body),
155    menuHeight = $('.nav_inner').outerHeight();
156    $('.sp_btn , .close').on('click', function(){
157        $('.sp_btn').toggleClass('active');
158        $('.nav_inner').toggleClass('open');
159        if ($('.sp_btn').hasClass('active')) {
160            $('.sp_btn em').html('close');
161            $('body,html').css({"overflow":"hidden","height":"100%"});
162        }else{
163            $('.sp_btn em').html('menu');
164            $('body,html').css({"overflow":"visible","height":"auto"});
165        }
166    });
167    //プルダウン
168    $('.nav_inner .menu_nav li span.dropbtn').on('click', function(){
169        $(this).toggleClass('open');
170        $(this).next('.dropbox').stop().slideToggle();
171    });
172
173    //モーダルウィンドウ
174    $('body').on('click', '.nav_inner .md_btn', function() {
175        $('.nav_inner .md_main .modal').fadeIn();
176    }).first().click();
177    //閉じる
178    $('body').on('click', '.nav_inner .md_main .modalClose', function() {
179        $(this).closest(".modal").fadeOut();
180    }).first().click();
181
182
183/*-----------------------------------------------------------------------------------*/
184
185/* 下層ページ
186
187/*-----------------------------------------------------------------------------------*/
188    /*公演情報
189    ------------------------------------------------*/
190    var windowWidth = $(window).width();
191    var windowSp = 767;
192    if (windowWidth <= windowSp) {
193		$('.genrebtn').on('click', function(){
194			$(this).toggleClass('open');
195			$(this).next('ul').stop().slideToggle(250);
196		});
197		$('#genrebtn_box ul li a').on('click', function(){
198			$(this).parent('li').parent('ul').stop().slideToggle(250);
199			var tabNavi_text_koen = $(this).text();
200			//alert(tabNavi_text_koen);
201			$('.genrebtn').text(tabNavi_text_koen);
202		});
203        $('#tabset_tab li a').on('click', function(){
204            $('.genrebtn').text("全ジャンル");
205        });
206    }
207
208
209
210
211    /*公演カレンダー
212    ------------------------------------------------*/
213    //　more
214    $('.page_calendar .calendar_box03 .calendar_table .in_main p.more_btn').on('click', function(){
215        $(this).toggleClass("open");
216        $(this).next(".morebox").stop().slideToggle();
217        if ($(this).hasClass("open")) {
218            $(this).html("close");
219        }else{
220            $(this).html("more");
221        }
222    });
223
224
225    /*SP 公演カレンダー , チケット情報
226    ------------------------------------------------*/
227    var windowWidth = $(window).width();
228    var windowSp = 767;
229    if (windowWidth <= windowSp) {
230        //アイコンについて
231        $('#calendar .calendar_box02 h2 , .page_ticket_info .icon_box h2').on('click', function(){
232            $(this).toggleClass("open");
233            $(this).next(".text_box").stop().slideToggle();
234        });
235    }
236
237
238    /*SP チケット情報
239    ------------------------------------------------*/
240    var windowWidth = $(window).width();
241    var windowSp = 767;
242    if (windowWidth <= windowSp) {
243        //more
244        $('.page_ticket_info .ticket_table_01 p.more_btn').on('click', function(){
245            $(this).toggleClass("open");
246            $(this).parent("td").parent("tr").children("td.main_td").stop().slideToggle();
247            $(this).parent("td").parent("tr").children("td.main_td").css( "display" , "block" );
248
249            if ($(this).hasClass("open")) {
250                $(this).html("close");
251            }else{
252                $(this).html("more");
253            }
254        });
255        //テーブル
256        $('.ticket_table_01 .mainbox02').prepend('<em class="name">公演会場</em>');
257        $('.ticket_table_01 .mainbox03').prepend('<em class="name">開催期間</em>');
258        $('.ticket_table_01 .mainbox04').prepend('<em class="name">チケット代</em>');
259        $('.ticket_table_01 .mainbox05').prepend('<em class="name">発売日</em>');
260        $('.ticket_table_01 .mainbox06').prepend('<em class="name">購入方法</em>');
261    }
262
263
264    /*SP お知らせ
265    ------------------------------------------------*/
266    var windowWidth = $(window).width();
267    var windowSp = 767;
268    if (windowWidth <= windowSp) {
269        //お知らせ
270        $('#tab-container-1-nav_box_info p').on('click', function(){
271            $(this).toggleClass('open');
272            $('#tab-container-1-nav_box_info ul').stop().slideToggle(250);
273        });
274		$('#tab-container-1-nav li a').on('click', function(){
275			var tabNavi_text_news = $(this).text();
276			//alert(tabNavi_text_news);
277			$('#tab-container-1-nav_box p').text(tabNavi_text_news);
278		});
279    }
280
281
282    /*財団について | 事業計画・報告／予算・決算ほか
283    ------------------------------------------------*/
284    $('.page_about_report .acd').on('click', function(){
285        $(this).toggleClass('open');
286        $(this).next(".box").stop().slideToggle();
287    });
288
289
290/*-----------------------------------------------------------------------------------*/
291
292/* TOPページ
293
294/*-----------------------------------------------------------------------------------*/
295    /*SP タブ
296    ------------------------------------------------*/
297    var windowWidth = $(window).width();
298    var windowSp = 767;
299    if (windowWidth <= windowSp) {
300        //お知らせ
301        $('#tab-container-1-nav_box p , #tab-container-1-nav_box ul li').on('click', function(){
302             $(this).toggleClass('open');
303            $('#tab-container-1-nav_box ul').stop().slideToggle();
304            return false;

305        });
306        //公演情報
307        $('#tab-container-2-nav_box p , #tab-container-2-nav_box ul li').on('click', function(){
308            $('#tab-container-2-nav_box ul').stop().slideToggle();
309            return false;
310        });
311    }
312
313
314    /*スライド
315    ------------------------------------------------*/
316    $('.slick01').slick({
317        autoplay: true,
318        arrows: true,
319        slidesToShow: 3,
320        slidesToScroll: 1,
321        pauseOnFocus: true,
322        pauseOnHover: true,
323        responsive: [
324            {
325                breakpoint: 1000,
326                settings: {
327                    slidesToShow: 2,
328                    slidesToScroll: 1
329                }
330            },
331            {
332                breakpoint: 767,
333                settings: {
334                    slidesToShow: 1,
335                    slidesToScroll: 1
336                }
337            }
338        ]
339    });
340
341    /*-----------------------------------------------------------------------------------*/
342
343    /* 埼玉アーツシアター通信SPアコーディオン
344
345    /*-----------------------------------------------------------------------------------*/
346        $('.contentsboxmore').find('.switchTrigger').click(function () {
347            $(this).closest('.contentsboxmore').find('.contentWrap').slideToggle(200);
348        });
349
350
351
352
353//JS記述終了
354});