https://www.city.fukushima.fukushima.jp/theme/base/js/top.js

1$(function(){
2
3  // テキストタブ
4  $.fn.textTab({defaultSelect:0,cookie:'topTab',tabs:$("#top-tab .list li"),pages:$("#top-tab .box")});
5
6  $.fn.textTab({defaultSelect:0,cookie:'serviceTab',tabs:$("#service-tab .list li"),pages:$("#service-tab .box")});
7
8  $.fn.textTab({defaultSelect:0,cookie:'newseTab',tabs:$("#news-tab .list li"),pages:$("#news-tab .box")});
9
10
11  // 広告クリックをカウントする(GA4)
12  $('.js-kb-click .list a').bannerClick2({});
13
14  $.fn.bousaiListViewCustom = function(config) {
15  // 初期値
16  config = $.extend({
17    rssPath: site_domain + '/cgi-bin/bosai_info.php',
18    ulClass: '.list',
19    textClass: '.text',
20    dateClass: '.date',
21    dateformat: 'YYYY年MM月DD日(WW)',
22    limit: 5,               // ← 追加
23    noDataView: 0           // ← 追加（必要に応じて）
24  },config);
25
26  // パラメーターのエラー判定
27  var errorMsg = '';
28  for(key in config) {
29    var value = config[key];
30    // 空文字の判定
31    if(value === '') {
32      errorMsg += 'エラー：' + key + 'に空文字が入っています\n';
33    } else {
34      // 数値かどうかの判定
35      if(key === 'limit' || key === 'noDataView') {
36        if($.type(value) !== 'number'){
37          errorMsg += 'エラー：' + key + 'に文字列が入っています\n';
38        }
39      // 文字列かどうかの判定
40      } else {
41        if($.type(value) !== 'string') {
42          errorMsg += 'エラー：' + key + 'に数値が入っています\n';
43        }
44      }
45    }
46  }
47  // エラーあれば実行しない
48  if(errorMsg) {
49    console.error(errorMsg);
50  // エラーなければ実行
51  } else {
52    $.ajax({

53      url:config.rssPath,
54      timeout: 10000,
55      dataType: 'json',
56      context:this,
57      success:function(json){
58        var itemList = json.data; //xml配列を変数に格納
59        var $parentBox = this; //表示エリアを選択
60        var $smartAlertUlBox = $parentBox.find(config.ulClass); //ulタグを選択
61        var $li = $smartAlertUlBox.find('li:first'); //liタグを選択
62        var litags = '';
63        // --------------------------------------------
64        //アラートがあれば
65        if(itemList.length){
66          //xmlデータをまわす
67          $(itemList).each(function(idx){
68            if(idx >= config.limit){
69              return false;
70            }
71            //アラート内容の作成
72            var smartAlertTitle = this.title;
73            var smartAlertLink = this.url;
74            var smartAlertdate = this.date;
75            //リンクの挿入
76            if($li.find('a').length) {
77              $li.find('a').attr('href', smartAlertLink);
78            }
79            //アラート内容の挿入
80            if($li.find(config.textClass).length) {
81              $li.find(config.textClass).text(smartAlertTitle);
82            }
83            //アラート日付の挿入
84            if($li.find(config.dateClass).length) {
85              $li.find(config.dateClass).text(smartAlertdate);
86            }
87            litags += $li.prop('outerHTML');
88          });
89          //追加
90          $smartAlertUlBox.html(litags);
91          // エリアの表示
92          $parentBox.css('display', 'block');
93
94        // --------------------------------------------
95        //アラートがなければ
96        // --------------------------------------------
97        } else {
98          if(config.noDataView) {
99            $parentBox.css('display', 'block');
100            $li = config.noDataClass ? $(config.noDataClass) : '<li>現在、災害・気象情報はありません。</li>';
101            $smartAlertUlBox.html($li);
102          } else {
103            $parentBox.remove(); //エリアごと削除
104          }
105        }
106      }
107    });
108  }
109  return this;
110  };  
111
112
113  // 防災無線カスタムの出力
114  $('#bousai').bousaiListViewCustom({
115    rssPath: site_domain + '/cgi-bin/bosai_info.php',
116    ulClass: '.list',
117    textClass: '.item-title',
118    dateClass: '.date',
119    noDataView: 1    
120  })
121
122
123  splide({
124    splideElement: '#image-carousel',
125    pcMinSlideLength: 1,
126    spMinSlideLength: 1,
127    type: 'loop',
128    autoplay: true,
129    pagination: true,
130    perMove: 1,
131    speed: 1000,
132    interval: 5000,
133    autoWidth: true,
134    focus: "center",
135    arrows: false, // 矢印ボタンを非表示
136    pauseOnHover: boolean = false,
137      classes: {
138        pagination: "splide__pagination your-class-pagination",
139        page: "splide__pagination__page your-class-page",
140      },
141  });
142
143
144
145  splide({
146    splideElement: '#image-carousel2',
147    pcMinSlideLength: 3,
148    spMinSlideLength: 1,
149    type: 'loop',
150    autoplay: true,
151    pagination: true,
152    perPage: 3,
153    perMove: 1,
154    speed: 1000,
155    interval: 5000,
156    autoWidth: true,
157    focus: "center",
158    arrows: true, // 矢印ボタンを非表示
159    pauseOnHover: boolean = false,
160    gap: '20px',
161      classes: {
162        pagination: "splide__pagination your-class-pagination",
163        page: "splide__pagination__page your-class-page",
164      },
165      navigation: {
166        nextEl: ".swiper-button-next",
167        prevEl: ".swiper-button-prev",
168      },
169      breakpoints: {
170        768: {
171          perPage: 1,
172          gap: '13px',
173        },
174      },
175  });
176
177  splide({
178    splideElement: '#image-carousel3',
179    pcMinSlideLength: 3,
180    spMinSlideLength: 1,
181    type: 'loop',
182    autoplay: true,
183    pagination: true,
184    perPage: 3,
185    perMove: 1,
186    speed: 1000,
187    interval: 5000,
188    autoWidth: true,
189    focus: "center",
190    arrows: true, // 矢印ボタンを非表示
191    pauseOnHover: boolean = false,
192    gap: '20px',
193      classes: {
194        pagination: "splide__pagination your-class-pagination",
195        page: "splide__pagination__page your-class-page",
196      },
197      navigation: {
198        nextEl: ".swiper-button-next",
199        prevEl: ".swiper-button-prev",
200      },
201      breakpoints: {
202        768: {
203          perPage: 1,
204          gap: '15px',
205        },
206      },
207  });
208
209});
210
211
212
213