https://www.mukogawa-u.ac.jp/js/function-toponly.js

1//ーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーー
2//メインビジュアル関連
3//ーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーー
4
5/*
6
7      // 即時実行関数式で定義する
8      (function(){
9        // MediaQueryListオブジェクトを生成する
10        const mql = window.matchMedia('(min-width: 767px)');
11
12        // 動画再生を制御するメソッド
13        function setVideoSrc(){
14          const element = document.getElementById('videoElement');
15
16          if (mql.matches) {
17            // カスタムデータ属性の値をsrc属性に設定する
18            element.src = element.dataset.src;
19
20            // video要素をリセットして、動画ファイルの読み込みを開始する
21            element.load();
22          }
23        }
24        // DOMContentLoadedイベントにリスナーを設定する
25        document.addEventListener('DOMContentLoaded', setVideoSrc);
26
27        // MediaQueryListオブジェクトのchangeイベントにリスナーを設定する
28        mql.addEventListener('change', setVideoSrc);
29      })();
30
31
32$(function () {
33    $('.play-btn').on('click', function(){ // 再生ボタンが押されたら
34        if($(this).hasClass('playActive')){
35            $('.video1').get(0).pause();
36        }else{
37            $('.video1').get(0).play();
38        }
39    });
40
41    $('.video1').on('playing', function(){
42        $('.play-btn').addClass('playActive'); 
43        $(this).attr('controls', 'false'); // ブラウザが表示する再生ボタンを非表示にするために後から属性付与
44    });
45
46    $(".video1").on('pause', function(){
47        $('.play-btn').removeClass('playActive');
48        $(this).removeAttr('controls');
49    });
50
51    $('.video1').on('ended', function(){ 
52        $('.playBt').removeClass('playActive');
53        $(this).removeAttr('controls');
54    });
55});
56        	
57*/
58
59
60
61//ーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーー
62//topHeroスライダー 
63//ーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーー
64
65
66/*
67(function ($) {
68  function setimage() {
69    var $height = $("#topHero").height();// もしくは高さ$(window).height(); 
70    var $width = $(window).width();
71    var win_ratio = $width / $height;
72    $("#topHero ul li").css({ "height": $height });
73    if (win_ratio > 1.5) {　//画像の比率が大きかったら
74      $("#topHero ul li .topHero-img").css({ "width": "100%", "height": "auto", "margin-left": 0 });
75      var winwidth = $("#topHero").width();
76      var imgheight = winwidth * 0.66;
77      var winheight = $("#topHero").height();
78      var imgtopmargin = (imgheight - winheight) / 2;
79      $("#topHero ul li .topHero-img").css({ "margin-top": -imgtopmargin });
80    } else if (win_ratio < 1.5) {　//画像の比率が小さかったら
81      var imgwidth = (($height / 800)) * 1200;
82      var winwidth = $("#topHero").width();
83      var imgmargin = (winwidth - imgwidth) / 2;
84      $("#topHero ul li .topHero-img").css({ "width": imgwidth, "height": $height, "margin-left": imgmargin, "margin-top": 0 });
85    }
86  }
87  //slide
88  $(function () {
89    setimage();
90    var $interval = 4000; // 切り替わりの間隔（ミリ秒）20230119変更前8000
91    var $fade_speed = 2000; // フェード処理の早さ（ミリ秒）
92    $("#topHero ul li").hide().css({ "position": "absolute", "top": 0, "left": 0 });
93    $("#topHero ul li:first").addClass("active").show();
94    $("#topHero ul li:first .topHero-img").animate({ paddingRight: 0.1 }, {
95      duration: 6000,
96      step: function (now, fx) { $(this).css({ transform: 'scale(' + (1 + now) + ')' }); },
97      complete: function () { $("#topHero ul li .topHero-img").css("paddingRight", 0); }
98    })
99    setInterval(function () {
100      var $active = $("#topHero ul li.active");
101      var $activeafter = $("#topHero ul li.active:after");
102      var $next = $active.next("li").length ? $active.next("li") : $("#topHero ul li:first");
103      //$active.fadeOut($fade_speed,function(){$active.removeClass("active");});
104      $active.fadeOut($fade_speed);
105      $active.removeClass("active");
106      $next.fadeIn($fade_speed).addClass("active");

107      $("#topHero ul li.active .topHero-img").animate({ paddingRight: 0.1 }, {
108        duration: 6000,
109        step: function (now, fx) { $(this).css({ transform: 'scale(' + (1 + now) + ')' }); },
110        complete: function () { $("#topHero ul li .topHero-img").css("paddingRight", 0); }
111      })
112    }, $interval);
113  });
114  //resi
115  var timer = false;
116  $(window).resize(function () {
117    if (timer !== false) {
118      clearTimeout(timer);
119    }
120    timer = setTimeout(function () {
121
122      setimage();
123    }, 200);
124  });
125
126})(jQuery);
127*/
128
129
130//ーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーー
131//swiper function
132//ーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーー
133
134document.addEventListener('DOMContentLoaded', () => {
135  const topHeroSwiper = new Swiper('#topHero', {
136    effect: 'fade',
137    loop: true,
138    autoplay: {
139      delay: 5000,
140      disableOnInteraction: false
141    },
142    speed: 1000,
143    fadeEffect: { crossFade: true },
144    autoHeight: true,
145    on: {
146      slideChangeTransitionStart: function () {
147        // 全スライドからズームクラスを削除
148        document.querySelectorAll('.swiper-topHero-img').forEach(sli

148de => {
149          slide.classList.remove('active-zoom');
150        });
151        // 現在アクティブスライドにズームクラスを追加
152        const activeSlide = this.slides[this.activeIndex];
153        activeSlide.classList.add('active-zoom');
154      }
155    }
156  });
157});
158
159
160
161
162
163
164$(document).ready(function () {
165  var swiper = new Swiper('#topBnrSlider .swiper-container', {
166    loop: true,
167    slidesPerView: 2,
168    spaceBetween: 0,
169    /**/
170    autoplay: {
171      delay: 4000,
172      disableOnInteraction: false,
173    },
174
175    pagination: {
176      el: '#topBnrSlider .swiper-pagination',
177      clickable: true,
178    },
179    navigation: {
180      nextEl: '#topBnrSlider .swiper-button-next',
181      prevEl: '#topBnrSlider .swiper-button-prev',
182    }
183  });
184});
185
186
187//ーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーー
188//カスタムスクロールバー function
189//ーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーー
190$(document).ready(function () {
191  $(".info-list-scrollbox").mCustomScrollbar({
192    scrollButtons: {
193      enable: false,
194      scrollType: "continuous",
195      scrollSpeed: 50,
196      scrollAmount: 50
197    },
198    advanced: {
199      updateOnContentResize: true
200    },
201    theme: "dark-3"
202  });
203});
204
205
206
207
208//ーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーー
209//slick
210//ーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーー
211/**/
212$('.slider').slick({ //{}を入れる
213  autoplay: true,
214  infinite: true,
215  speed: 500,
216  slidesToShow: 1,
217  centerPadding: '25%',
218  slidesToScroll: 1,
219  prevArrow: '<div class="swiper-button-prev"></div>',
220  nextArrow: '<div class="swiper-button-next"></div>',
221  centerMode: true,
222  variableWidth: true,
223  dots: true,
224  responsive: [
225    {
226      breakpoint: 768,
227      settings: {
228        centerPadding: '15%',
229        variableWidth: false,
230      }
231    },
232  ]
233});
234
235