https://konosekai.jp/wp-content/themes/konosekai/js/utility.js

1// JavaScript Document
2//ユーザーエージェントで端末の種類チェック
3var userAgent = window.navigator.userAgent;
4
5function check_ua() {
6   if((userAgent.indexOf('Android') > 0 && userAgent.indexOf('Mobile') == -1) || userAgent.indexOf('iPad') > 0){
7    return true;
8   } else {
9    return false;
10   }
11}
12
13//スクロールストップ
14$(function(){
15  var scrollStopEvent = new $.Event("scrollstop");
16  var delay = 50;
17  var timer;
18 
19  function scrollStopEventTrigger(){
20    if (timer) {
21      clearTimeout(timer);
22    }
23    timer = setTimeout(function(){$(window).trigger(scrollStopEvent)}, delay);
24  }
25  $(window).on("scroll", scrollStopEventTrigger);
26  $("body").on("touchmove", scrollStopEventTrigger);
27});
28
29var head_timer;
30$(function() {
31  if($('#top').size() > 0) {
32     set_txt_w();
33     //set_img_l();
34     $(window).resize(function() {
35        //set_img_l();
36        /*set_txt_w();*/
37     });
38     set_nav_top();
39     click_allow();
40     set_slider_w();
41     click_chara_thum();
42     set_story_pic();
43     scroll_lazy();
44     set_commnet();
45     set_tw_tl();
46     set_top_news();
47     check_movie();
48  } else/* if($('#campaign').size() > 0 || $('#staffroom').size() > 0 || $('#report').size() > 0 || $('#era').size() > 0 || $('#production-note').size() > 0)*/ {
49     set_nav_sp();
50     click_nav_sp();
51
52  }
53  set_smooth();
54  hide_pt();
55  if(check_ua()){
56    /*head_timer = setTimeout("set_header()", 1);*/
57  }
58});
59$(window).load(function(e) {
60  if($('#special').size() == 0 && $('#report').size() > 0) {
61   set_footer();
62   $(window).resize(function() {
63      set_footer();
64   });
65  }
66});
67
68//下層ページのスムーススクロール
69function set_smooth() {
70   // #で始まるアンカーをクリックした場合に処理
71   $('a[href^=#]').click(function() {
72      // スクロールの速度
73      var speed = 1000; // ミリ秒
74      // アンカーの値取得
75      var href= $(this).attr("href");
76      // 移動先を取得
77      var target = $(href == "#" || href == "" ? 'html' : href);
78      // 移動先を数値で取得
79      var position = target.offset().top-70;
80      // スムーススクロール
81      $('body,html').animate({scrollTop:position}, speed, 'easeOutCirc');
82      return false;
83   });
84}
85
86/*トップページ ナビゲーションの「作品情報」のクリックを無効化しサブナビ表示に*/
87function set_nav_top() {
88 //console.log("set");
89 $('#menu-item-541 a').attr('href','javascript:void(0)').attr('onclick','set_sub_nav(); return false;');
90}
91/*トップページのサブナビゲーションの表示非表示*/
92function set_sub_nav() {
93     $('nav div.top-page-anc').slideToggle();
94}
95
96/*レポートページならスペシャル用サブナビゲーションを開く*/
97function set_nav_sp() {
98    if($('#campaign').size() > 0 || $('#staffroom').size() > 0 || $('#report').size() > 0 || $('#timeline').size() > 0 || $('#production-note').size() > 0 || $('#goods').size() > 0 || $('#media').size() > 0 || $('#comment').size() > 0 || $('#interview').size() > 0 || $('#award').size() > 0) {
99   //console.log("size");
100       $('#menu-item-576 > a').attr('href','javascript:void(0)');
101       $('#menu-item-577 > a').attr('href','javascript:void(0)');
102    }
103   if($('#report').size() > 0) {
104     $('#menu-item-576 .sub-menu').css('display','block');
105   } else if($('#goods').size() > 0) {
106     $('#menu-item-577 .sub-menu').css('display','block');
107   }
108}
109/*スペシャル用サブナビゲーションの開閉*/
110function click_nav_sp() {
111   $('#menu-item-576 > a').click(function(e) {
112      $(this).next().slideToggle();
113			});
114   $('#menu-item-577 > a').click(function(e) {
115      $(this).next().slideToggle();
116			});
117}
118
119function   set_txt_w() {
120 var win_w = $(window).width();
121 var in_txt_w = $('.in-txt-space .txt-inner').width();
122 //alert(in_txt_w);
123 var in_txt_mar = (win_w - 900)/2;
124 var in_allow_mar = (win_w - 1000)/2;
125 $('.in-txt-space .txt-inner').css({marginLeft:in_txt_mar,marginRight:in_txt_mar});
126 $('li.in-prv').css('left',in_allow_mar);
127 $('li.in-nxt').css('right',in_allow_mar);
128}
129
130/*スライダーの内側の幅を指定*/
131function set_slider_w() {
132 var slider_kazu = $('.slider-cont').length;
133 for (var i = 0; i < slider_kazu; i++) {
134  var block_num = $('.slider-cont:eq('+ i + ') .slider-box li').length;
135 //console.log(block_num);
136  var cont_w = 930*block_num;
137  $('.slider-cont:eq('+ i + ') .slider-box').width(cont_w);
138 }
139}
140

141/*スライダー矢印クリックの動作*/
142function click_allow() {
143 $('#top ul.scroll-allow li').click(function(e) {
144  //スライダーボックスを変数に代入
145  var cont = $(this).parent().next();
146  //スライダーボックスの長さ
147  var cont_w = cont.width();
148  //ブロック数
149  var block_num = cont.find('li').length;
150  //console.log("block_num:" + block_num);
151
152  //ボタンの右左を判定
153   var al_val = $(this).attr('class');
154   var al_scroll_l = cont.css('left');
155   al_scroll_l = parseInt(al_scroll_l);
156   //console.log("al_scroll_l:" + al_scroll_l);
157   if(al_val.match(/prv/)) {
158     if(al_scroll_l < 0) {
159       var check_num;
160       for(var i=block_num-1; i >= 0; i--) {
161         check_num = -930*i;
162         //console.log(check_num);
163         if(check_num > al_scroll_l) {
164            al_scroll_l = check_num;
165            break;
166         }
167      }
168     }
169   } else {
170     if(al_scroll_l > -1*(cont_w-930)) {
171       var check_num;
172       for(var i=0; i < block_num; i++) {
173         check_num = -930*i;
174         //console.log(check_num);
175         if(check_num < al_scroll_l) {
176            al_scroll_l = check_num;
177            break;
178         }
179      }
180     }
181   }
182   //矢印の表示非表示
183   //スライダーボックスの移動
184   $(this).parent().next().animate({left:al_scroll_l},1000,"easeInOutQuint");
185   if(al_val.match(/prv/)) {
186    $(this).animate({left:-55},50,function() {
187     $(this).animate({left:-45},50);
188    })
189   } else {
190    $(this).animate({right:-55},50,function() {
191     $(this).animate({right:-45},50);
192    })
193   }
194
195   //各項目の透明度を変更。
196   var target_num = Math.abs(al_scroll_l)/930;
197   for(var i=0; i < block_num; i++) {
198    if(i == target_num) {
199       cont.find('li').eq(i).animate({opacity:1},1000,"easeInOutQuint");
200    } else {
201       cont.find('li').eq(i).animate({opacity:0.1},1000,"easeInOutQuint");
202    }
203   }
204   //矢印の表示非表示
205   $(this).parent().find('li').fadeIn(1000);
206   if(target_num == (block_num-1)) {
207     $(this).fadeOut(750);
208   } else if(target_num == 0) {
209     $(this).fadeOut(750);
210   }
211 });
212}
213
214function click_chara_thum() {
215 $('#top ul.chara-link-list li a').click(function(e) {
216    var cont = $('section#character .slider-box');
217    var block_num = cont.find('li').length;
218    var ch_th_val = $(this).attr('class');
219    var block_val = parseInt(ch_th_val.slice(-1))-1;
220    var al_scroll_l = -930*block_val;
221    cont.animate({left:al_scroll_l},1000,"easeInOutQuint");
222
223    var target_num = Math.abs(al_scroll_l)/930;
224    for(var i=0; i < block_num; i++) {
225      if(i == target_num) {
226        cont.find('li').eq(i).animate({opacity:1},1000,"easeInOutQuint");
227      } else {
228        cont.find('li').eq(i).animate({opacity:0.1},1000,"easeInOutQuint");
229      }
230    }
231   //矢印の表示非表示
232   $('#top section#character ul.scroll-allow li').fadeIn(1000);
233   if(target_num == (block_num-1)) {
234     $('#top section#character ul.scroll-allow li.nxt').fadeOut(1000);
235   } else if(target_num == 0) {
236     $('#top section#character ul.scroll-allow li.prv').fadeOut(1000);
237   }
238 });
239}
240
241//「ものがたり」の写真切り替え
242function set_story_pic() {
243 var st_pic_leng = $('#story .pic-space li').length;
244 //console.log("st_pic_leng:"+ st_pic_leng);
245 var st_pic_in_leng = $('#story .pic-space li:first-of-type p').length;
246 
247 var pic_val=0;
248 var pic_in_val=0;
249 //var pic_val_nxt;
250 var pic_in_val_nxt;
251 
252 var pic_timer = setTimeout(change_pic, 5000);
253 
254 function change_pic() {
255   clearTimeout(pic_timer);
256   pic_in_val_nxt = pic_in_val + 1;
257   if(pic_in_val_nxt >=  st_pic_in_leng) {
258      pic_in_val_nxt = 0;
259   }
260   $('#story .pic-space li:eq(' + pic_val + ') p:eq('+pic_in_val+')').fadeOut(2000);
261   $('#story .pic-space li:eq(' + pic_val + ') p:eq('+pic_in_val_nxt+')').fadeIn(2000);
262   
263   pic_val++;
264   if(pic_val >=  st_pic_leng) {
265      pic_val = 0;
266      pic_in_val=pic_in_val_nxt;
267      //pic_in_val=0;
268      pic_timer = setTimeout(change_pic, 8500);
269   } else {
270     pic_timer = setTimeout(change_pic, 500);
271   }
272 }
273}
274
275//スクロールで表示非表示
276function scroll_lazy() {
277   //タブレットは除外（すべて表示）
278   if(check_ua()){
279    $('#top div#content section').css('opacity',1);
280   } else {
281  //情報項目用
282     $(window).on("scrollstop",function(){
283       var section_val = $('section').length;
284       var scroll_val = $(this).scrollTop()+$(this).height()-150;
285       for(var i=0; i<section_val; i++) {
286          var sec_obj = $('section:eq('+i+')');
287          var sec_id = sec_obj.attr('class');
288          //if(sec_id != 'pic-l') {
289             var sec_val = sec_obj.offset().top;
290             if(scroll_val >sec_val) {
291                if(sec_obj.css('opacity') != 1) {
292                   sec_obj.animate({opacity:1},500);
293                }
294             } else {
295                if(sec_obj.css('opacity') != 0) {
296                   sec_obj.animate({opacity:0}

296,500);
297                }
298             }
299          //}
300        }//end for
301		   });
302   }//end if
303  //大画像スペース用
304  /*$(window).scroll(function(e){
305    var section_val = $('section').length;
306    var scroll_val = $(this).scrollTop()+$(this).height()-150;
307    for(var i=0; i<section_val; i++) {
308       var sec_obj = $('section:eq('+i+')');
309       var sec_id = sec_obj.attr('class');
310       if(sec_id == 'pic-l') {
311          console.log(sec_id);
312          var sec_val = sec_obj.offset().top;
313          if(scroll_val >sec_val) {
314             if(sec_obj.css('opacity') != 1) {
315                sec_obj.animate({opacity:1},500);
316             }
317          } else {
318             if(sec_obj.css('opacity') != 0) {
319                sec_obj.animate({opacity:0},500);
320             }
321          }
322       }
323    }
324		});*/
325}
326
327//ページトップボタンの表示非表示    
328function hide_pt() {
329 var scrolltop = $(window).scrollTop();
330 //console.log("scrolltop:"+scrolltop);
331 if(scrolltop != 0) {
332  $('.pagetop').fadeIn();
333 } else {
334  $('.pagetop').fadeOut();
335 }
336 setTimeout('hide_pt()',1000);
337}
338
339//トップページ　ブックナビゲーションのアニメーション
340function move_book() {
341 $('#top ul.inner-bnr-space li a').hover(function(e) {
342  $(this).find('span').animate({width:'-60px',height:143},1000);  
343 },
344 function(e) {
345  $(this).find('span').animate({width:'91px',height:143},1000);  
346 })
347}
348
349//トップページ 大画像の位置調整
350function set_img_l() {
351 //$(window).resize(function() {
352    var win_w = $(window).width();
353    var win_h = $(window).height();
354    var img_l_h = win_w*0.54;
355    var w_h_diff = (win_h-img_l_h)/2;
356    $('#top div#content section.pic-l img').css('top',w_h_diff);
357 //})
358}
359
360//初期表示時にムービーを再生済みかチェック
361function check_movie() {
362 var mv_val = $.cookie('movie');
363 if(mv_val != 'played') {
364  open_movie_4();
365  $.cookie('movie','played',{expires:1});
366 }
367}
368
369//本予告の全画面表示
370function open_movie_1() {
371 $('body').prepend('<div class="movie-space"><p class="movie-base"></p><div class="movie-cont"><p class="movie-close"><img src="/wp-content/themes/konosekai/images/top/movie-close.png" width="14" height="14" alt="close"/></p><div class="movie-box"><iframe width="720" height="405" src="https://www.youtube.com/embed/yoI9Yl60BqU?autoplay=1&rel=0&mute=1" frameborder="0" allowfullscreen></iframe></div></div></div><!--.movie-space-->');
372 $('.movie-space').fadeIn();
373 close_click();
374 set_mov_h();
375 /*$(window).scroll(function() {
376  set_mov_h();
377 });*/
378}
379//特報の全画面表示
380function open_movie_2() {
381 $('body').prepend('<div class="movie-space"><p class="movie-base"></p><div class="movie-cont"><p class="movie-close"><img src="/wp-content/themes/konosekai/images/top/movie-close.png" width="14" height="14" alt="close"/></p><div class="movie-box"><iframe width="720" height="405" src="https://www.youtube.com/embed/6LC0uBDSXc8?autoplay=1&rel=0&mute=1" frameborder="0" allowfullscreen></iframe></div></div></div><!--.movie-space-->');
382 $('.movie-space').fadeIn();
383 close_click();
384 set_mov_h();
385 /*$(window).scroll(function() {
386  set_mov_h();
387 });*/
388}
389//主題歌の全画面表示
390function open_movie_3() {
391 $('body').prepend('<div class="movie-space"><p class="movie-base"></p><div class="movie-cont"><p class="movie-close"><img src="/wp-content/themes/konosekai/images/top/movie-close.png" width="14" height="14" alt="close"/></p><div class="movie-box"><iframe width="720" height="405" src="https://www.youtube.com/embed/26ZaU5F0wrA?autoplay=1&rel=0&mute=1" frameborder="0" allowfullscreen></iframe></div></div></div><!--.movie-space-->');
392 $('.movie-space').fadeIn();
393 close_click();
394 set_mov_h();
395 /*$(window).scroll(function() {
396  set_mov_h();
397 });*/
398}
399//特報の全画面表示
400function open_movie_4() {
401 $('body').prepend('<div class="movie-space"><p class="movie-base"></p><div class="movie-cont"><p class="movie-close"><img src="/wp-content/themes/konosekai/images/top/movie-close.png" width="14" height="14" alt="close"/></p><div class="movie-box"></div></div></div><!--.movie-space-->').delay(3000).queue(function(){
402		$('.movie-box').html('<iframe width="720" height="405" src="https://www.youtube.com/embed/8DcK_7AaYm0?autoplay=1&rel=0&mute=1" frameborder="0" allowfullscreen></iframe>');
403		$(this).dequeue();
404	}); 
405 $('.movie-space').fadeIn();
406 close_click();
407 set_mov_h();
408 /*$(window).scroll(function() {
409  set_mov_h();
410 });*/
411}
412 
413 function open_movie_5() {
414 $('body').prepend('<div class="movie-space"><p class="movie-base"></p><div class="movie-cont"><p class="movie-close"><img src="/wp-content/themes/konosekai/images/top/movie-close.png" width="14" height="14" alt="close"/></p><div class="movie-box"><iframe width="720" height="405" src="https://www.youtube.com/embed/dPrtnkCD2aA?autoplay=1&rel=0&mute=1" frameborder="0" allowfullscreen></iframe></div></div></div><!--.movie-space-->');
415 $('.movie-space').fadeIn();
416 close_click();
417 set_mov_h();
418}
419function open_movie_6() {
420 $('body').prepend('<div class="movie-space"><p class="movie-base"></p><div class="movie-cont"><p class="movie-close"><img src="/wp-content/themes/konosekai/images/top/movie-close.png" width="14" height="14" alt="close"/></p><div class="movie-box"><iframe width="720" height="405" src="https://www.youtube.com/embed/2XBbirPpR9M?auto

420play=1&rel=0&mute=1" frameborder="0" allowfullscreen></iframe></div></div></div><!--.movie-space-->');
421 $('.movie-space').fadeIn();
422 close_click();
423 set_mov_h();
424}
425
426
427
428function set_mov_h() {
429  var mov_h_pos = ($(window).height() - $('.movie-cont').height())/2 + $(window).scrollTop();
430  $('.movie-cont').css('top',mov_h_pos);
431}
432
433function close_click() {
434 $('.movie-close').click(function(e) {
435		$('.movie-space iframe').hide();
436  $('.movie-space').fadeOut(function(){
437    $('.movie-space').remove();
438   });
439 })
440 $('.movie-base').click(function(e) {
441		$('.movie-space iframe').hide();
442  $('.movie-space').fadeOut(function(){
443    $('.movie-space').remove();
444   });
445 })
446}
447
448//ページを拡大してもヘッダーが横スクロールに追随する様にする。
449function set_header() {
450 clearTimeout(head_timer);
451 
452 //$('header').width(1000);
453 
454 var winW;
455 /*if (userAgent.indexOf("WebKit")==-1){
456   winW=document.documentElement.clientWidth+17;
457 } else {*/
458   winW=document.documentElement.clientWidth;
459 //}
460 if(winW >= 1000) {
461   $('header').css({left:'50%',marginLeft:'-500px'});
462 } else {
463    var winLeft = ($(window).scrollLeft());
464    $('header').css({left:winLeft,marginLeft:'0px'});
465 }
466 head_timer = setTimeout("set_header()", 1);
467}
468
469function set_commnet() {
470  $('footer').after($('.cast-commnet-cont'));
471  $('.btn-comment').click(function(){
472   $('.cast-commnet-cont').fadeIn();
473  })
474  
475  $('span.comment-close').click(function(){
476   $('.cast-commnet-cont').fadeOut();
477   })
478   $('.cast-commnet-cont').click(function(){
479   $(this).fadeOut();
480   })
481  
482}
483
484/*トップページ ツイッターウィジェットのスタイル制御（ウィジェットロード後でないと適用できないので、jsで記述）*/
485function set_tw_tl() {
486   var $twitter_widget = $('iframe.twitter-timeline');
487  var $twitter_widget_contents = $twitter_widget.contents();
488  
489  if ($twitter_widget.length > 0 && $twitter_widget[0].contentWindow.document.body.innerHTML !== ""){
490    $('#tw-box iframe').contents().find('.SandboxRoot .timeline-Header-title').css({fontSize:'18px',lineHeight:'1em'});
491    $('#tw-box iframe').contents().find('.SandboxRoot .timeline-Tweet-text').css({fontSize:'14px',lineHeight:'1.5em'});
492    $('#tw-box iframe').contents().find('.SandboxRoot .timeline-Header').css({padding:'5px'});
493  }
494  else {
495    setTimeout(function(){
496      set_tw_tl();
497    }, 350);
498  }
499}
500
501/*トップページ、ニュース表示の制御*/
502/*var top_news_timer;
503function set_top_news() {
504  clearTimeout(top_news_timer);

505  var news_leng = $('#top div.news-picup p').length;
506  if($('.news_dsp').size() == 0) {
507     $('#top div.news-picup p:first-of-type').addClass('news_dsp');
508     top_news_timer = setTimeout("set_top_news()", 5000);
509  } else {
510   for(var i = 0; i<news_leng; i++) {
511     if($('#top div.news-picup p:eq('+i+')').hasClass('news_dsp')) {
512       var news_nxt_num = i+1;
513       if(news_nxt_num == news_leng) {
514         news_nxt_num=0;
515       }
516       $('#top div.news-picup p:eq('+i+')').animate({top:'-20px',opacity:'0'},function(){
517         $('#top div.news-picup p:eq('+i+')').removeClass('news_dsp').css({opacity:'1'});
518       });
519       $('#top div.news-picup p:eq('+news_nxt_num+')').css({opacity:'0',top:'20px'}).addClass('news_dsp').animate({top:'0px',opacity:'1'},function(){
520         top_news_timer = setTimeout("set_top_news()", 5000);
521       });
522     }
523   }
524 }
525}*/
526
527var top_news_timer;
528function set_top_news() {
529  clearTimeout(top_news_timer);
530  var news_leng = $('#top div.news-picup p').length;
531  if($('.news_dsp').size() == 0) {

532     $('#top div.news-picup p:first-of-type').addClass('news_dsp');
533     top_news_timer = setTimeout("set_top_news()", 5000);
534  } else {
535  var news_i;
536   for(var i = 0; i<news_leng; i++) {
537     if($('#top div.news-picup p:eq('+i+')').hasClass('news_dsp')) {
538       news_i = i;
539       move_op_news();
540       break;
541     }
542   }
543   function move_op_news() {
544       var news_nxt_num = news_i+1;
545       if(news_nxt_num == news_leng) {
546         news_nxt_num=0;
547       }
548       $('#top div.news-picup p:eq('+news_i+')').animate({top:'-20px',opacity:'0'},function(){
549         $('#top div.news-picup p:eq('+news_i+')').removeClass('news_dsp').css({opacity:'1'});
550       });
551       $('#top div.news-picup p:eq('+news_nxt_num+')').css({opacity:'0',top:'20px'}).addClass('news_dsp').animate({top:'0px',opacity:'1'},function(){
552         top_news_timer = setTimeout("set_top_news()", 5000);
553       });
554   }
555 }
556}
557
558//イベント詳細で、サイドナビがコンテンツより長いせいでフッターが浮く現象を修正。
559function set_footer() {
560 var side_h = $('#nav-side').outerHeight() ;
561 var art_h = $('.article').height() + 100;
562 var win_h = Math.max(side_h,art_h);
563 //var win_h = Math.max.apply( null, [document.body.clientHeight , document.body.scrollHeight, document.documentElement.scrollHeight, document.documentElement.clientHeight] );  
564 var footer_h = $('footer').outerHeight() ;
565 win_h = win_h + $('.under #main').outerHeight() + 100;
566 $('footer').css({position:'absolute',left:0,top:win_h});
567}