https://www.city.morioka.iwate.jp/_template_/_site_/_default_/_res/js/imageslider.js

1//------------------------------------------------------------------------------
2//	イメージスライダー(横スライドタイプ、無限ループバージョン)
3//	Copyright (C) 2024 FUTUREINN CO., LTD. All Rights Reserved.
4//------------------------------------------------------------------------------
5
6var TP_SLIDE = {};
7TP_SLIDE.time = 7000; //画像スライド切替時間
8
9(function(){
10var $ = FI.jQuery;
11
12	$(function() {
13		var menu_id = '.tmenuwrap';		//バナーが入っている部分のid
14		var scroll_id = '.scrollwrap';	//右、左のスクロールボタン部分のid
15		//------------------------------------------------------------
16		// 各エリアごとに情報を定義
17		//------------------------------------------------------------
18		var photo_id;					//トピックスライダーエリア全体のid
19		var tmenu_id;					//右、左のスクロールボタン部分のid
20		var panel_id;					//ページングと画像に付与するid
21		var bt_hide_flg;				//＜＞ボタンを非表示にする処理を有効にするか？
22		var autplpay_flg;				//自動再生を有効にするか？
23		var pg_hide_flg;				//ページングを表示させるか？
24		var options;					//スライダーオプション
25		//------------------------------------------------------------
26
27		//横スクロール1（#imageslider1～#imageslider20)
28		//最大のスライダーのid数を指定
29		const MAX_SLIDER_COUNT = 20;
30		
31		// 初期化済みのスライダーを追跡
32		var initializedSliders = new Set();
33		
34		// タイマーを管理するオブジェクト
35		var sliderTimers = {};
36		
37		// 再生状態を管理するオブジェクト
38		var sliderPlayStates = {};
39		
40		// 各スライダーの現在位置を管理
41		var sliderCurrentPositions = {};
42		
43		// 各スライダーのリサイズタイマーを個別管理
44		var sliderResizeTimers = {};
45		
46		// 各スライダーのリセット関数を保存
47		var sliderResetFunctions = {};
48		
49		// スライダー初期化関数
50		function initializeSlider(i) {
51			var sliderId = `#imageslider${i}`;
52			if ($(sliderId).length > 0 && !initializedSliders.has(sliderId)) {
53				// 要素が表示されているかチェック
54				var $slider = $(sliderId);
55				var isVisible = $slider.is(':visible');
56				var hasWidth = $slider.width() > 0;
57				
58				// 表示されていて、幅がある時だけ初期化
59				if (isVisible && hasWidth) {
60					photo_id = sliderId;
61					tmenu_id = `slidebtn${i}`;
62					panel_id = `imageslider${i}`;
63					options = getSliderOptions(photo_id);
64					topicsSlide(photo_id, menu_id, scroll_id, panel_id, options.bt_hide_flg, options.autplpay_flg, options.pg_hide_flg);
65					
66					// 初期化済みとしてマーク
67					initializedSliders.add(sliderId);
68					
69				}
70			}
71		}
72		
73		// 全スライダーの初期化を試行
74		function tryInitializeAllSliders() {
75			for (let i = 1; i <= MAX_SLIDER_COUNT; i++) {
76				initializeSlider(i);
77			}
78		}
79		
80		// 既存スライダーをリセットする関数
81		function resetAllInitializedSliders() {
82			initializedSliders.forEach(function(sliderId) {
83				if (sliderResetFunctions[sliderId]) {
84					sliderResetFunctions[sliderId]();
85				}
86			});
87		}
88		
89		// ページ読み込み時：表示されているスライダーを初期化
90		tryInitializeAllSliders();
91		
92		// ウィンドウリサイズ時：既存スライダーはresetのみ、新規はinitialize
93		var resizeTimer;
94		var currentWidth = window.innerWidth;
95		$(window).on('resize', function() {
96			if (currentWidth == window.innerWidth) {
97				return;
98			}
99			currentWidth = window.innerWidth;
100			
101			if (resizeTimer !== false) {
102				clearTimeout(resizeTimer);
103			}
104			
105			resizeTimer = setTimeout(function() {
106				// すべてのタイマーをクリア
107				for (var key in sliderTimers) {
108					clearTimeout(sliderTimers[key]);
109				}
110				sliderTimers = {};
111				
112				// 既存のスライダーのアニメーションを全て停止
113				$('[id^="imageslider"]').each(function() {
114					$(this).find('.tmenu').stop(true, true);
115				});
116				
117				// 既存の初期化済みスライダーはresetSliderを呼ぶ

118				initializedSliders.forEach(function(sliderId) {
119					var $slider = $(sliderId);
120					var isVisible = $slider.is(':visible');
121					var hasWidth = $slider.width() > 0;
122					
123					if (!isVisible || !hasWidth) {
124						// 非表示になった場合は初期化リストから削除
125						initializedSliders.delete(sliderId);
126						delete sliderResetFunctions[sliderId];
127						delete sliderCurrentPositions[sliderId];
128					} else {
129						// 表示されている場合はリセット
130						if (sliderResetFunctions[sliderId]) {
131							sliderResetFunctions[sliderId]();
132						}
133					}
134				});
135				
136				// 未初期化のスライダーのみ新規初期化
137				tryInitializeAllSliders();
138				
139			}, 300);
140		});
141		
142		// ビューモード切替時：未初期化のスライダーをチェック
143		$(document).on('click', '#viewmode_smp, #viewmode_pc', function() {
144			setTimeout(function() {
145				// すべてのタイマーをクリア
146				for (var key in sliderTimers) {
147					clearTimeout(sliderTimers[key]);
148				}
149				sliderTimers = {};
150				
151				// 既存のスライダーのアニメーションを全て停止
152				$('[id^="imageslider"]').each(function() {
153					$(this).find('.tmenu').stop(true, true);
154				});
155				
156				// 既存の初期化済みスライダーはresetSliderを呼ぶ
157				initializedSliders.forEach(function(sliderId) {
158					var $slider = $(sliderId);
159					var isVisible = $slider.is(':visible');
160					var hasWidth = $slider.width() > 0;
161					
162					if (!isVisible || !hasWidth) {
163						// 非表示になった場合は初期化リストから削除
164						initializedSliders.delete(sliderId);
165						delete sliderResetFunctions[sliderId];
166						delete sliderCurrentPositions[sliderId];
167					} else {
168						// 表示されている場合はリセット
169						if (sliderResetFunctions[sliderId]) {
170							sliderResetFunctions[sliderId]();
171						}
172					}
173				});
174				
175				// 未初期化のスライダーのみ新規初期化
176				tryInitializeAllSliders();
177			}, 600);
178		});
179		
180		// aria-expanded属性の変更を監視
181		if ('MutationObserver' in window) {
182			var observer = new MutationObserver(function(mutations) {
183				mutations.forEach(function(mutation) {
184					if (mutation.type === 'attributes' && mutation.attributeName === 'aria-expanded') {
185						var target = mutation.target;
186						var isExpanded = target.getAttribute('aria-expanded') === 'true';
187						
188						if (isExpanded) {
189							setTimeout(function() {
190								tryInitializeAllSliders();
191							}, 300);
192						}
193					}
194				});
195			});
196			
197			// ページ読み込み時とDOM変更時の両方に対応
198			function setupObserver() {
199				$('.hnmenu').each(function() {
200					// 既に監視対象になっていないかチェック（重複防止）
201					if (!$(this).data('observer-attached')) {
202						observer.observe(this, {
203							attributes: true,
204							attributeFilter: ['aria-expanded']
205						});
206						$(this).data('observer-attached', true);
207					}
208				});
209			}
210			
211			setupObserver();
212			
213			// リサイズ後も再度チェック（PC⇔スマホ切替で要素が変わる場合に対応）
214			$(window).on('resize', function() {
215				setTimeout(setupObserver, 100);
216			});
217			
218		} else {
219			// MutationObserverが使えない場合のフォールバック
220			$(document).on('click', '.hnmenu', function() {
221				var $this = $(this);
222				var isExpanded = $this.attr('aria-expanded') === 'true';
223				
224				if (!isExpanded) {
225					setTimeout(function() {
226						tryInitializeAllSliders();
227					}, 300);
228				}
229			});
230		}
231		
232		//HTMLからスライダーオプションを取得
233		function getSliderOptions(photo_id) {
234			// bt_hide_flgの判定
235			if ($(photo_id).find('.scrollwrap').length > 0) {
236				bt_hide_flg = false;
237			} else {
238				bt_hide_flg = true;
239			}
240			// autplpay_flgの判定
241			if ($(photo_id).find('.image_reel_play').length > 0) {
242				autplpay_flg = true;
243			} else {
244				autplpay_flg = false;
245			}
246			// pg_hide_flgの判定
247			if ($(photo_id).find('.paging').length > 0) {
248				pg_hide_flg = false;
249			} else {
250				pg_hide_flg = true;
251			}
252			if (!bt_hide_flg && !pg_hide_flg){
253				if ($(photo_id + ' .scrollwrap li').length > 0){
254					$(photo_id + ' .scrollwrap li button').attr({
255						'tabindex': -1,
256						'aria-hidden': true,
257					});

258				}
259			}
260			return {
261				bt_hide_flg: bt_hide_flg,
262				autplpay_flg: autplpay_flg,
263				pg_hide_flg: pg_hide_flg
264			};
265		}
266		
267		
268		//------------------------------------------------------------
269		// トピックスライダー処理
270		// photo_id		：トピックスライダーエリア全体のid
271		// menu_id		：バナーが入っている部分のid
272		// scroll_id	：右、左のスクロールボタン部分のid
273		// panel_id		：ページング画像とスライダー画像を結びつけるためのid
274		// bt_hide_flg	：＜＞ボタンを非表示にする処理を有効にするか？trueで非表示処理有効　falseで無効
275		// autplpay_flg	：自動再生処理を有効にするか？trueで処理有効　falseで無効
276		// pg_hide_flg	：ページング画像を非表示にする処理を有効にするか？trueで非表示処理有効　falseで無効
277		//------------------------------------------------------------
278		function topicsSlide(photo_id,menu_id,scroll_id,panel_id,bt_hide_flg,autplpay_flg,pg_hide_flg){
279			var $tmenu = $(photo_id + ' .tmenu');
280			var $r_menu = $(photo_id + ' ' + menu_id + ' .tmenu ul');
281			var get_r_menu_children = function() {
282				return $(photo_id + ' ' + menu_id + ' .tmenu ul').children('li').not('.clone');
283			};
284			$r_menu.removeClass('noscript');
285			
286			// スライド総数を定義（初期化時に設定）
287			var totalSlides = get_r_menu_children().length;
288			
289			// オリジナルのli要素に一意のdata属性を付与
290			get_r_menu_children().each(function(i) {
291				$(this).attr('data-original-index', i);
292			});
293			
294			// このスライダーの既存タイマーをクリア
295			if (sliderTimers[photo_id]) {
296				clearTimeout(sliderTimers[photo_id]);
297				delete sliderTimers[photo_id];
298			}
299			
300			// 既存のイベントをクリア（重複防止）
301			$(photo_id + ' .back button').off();
302			$(photo_id + ' .next button').off();
303			$(photo_id + ' .image_reel_play').off();
304			$(photo_id + ' .image_reel_stop').off();
305			$(photo_id + ' .paging li button').off();
306			$(photo_id + ' .pagingwrap ul li button').off('focus mouseenter blur mouseleave');
307			$(photo_id).off('keydown');
308			$r_menu.off('touchstart touchmove touchend');
309			
310			var tmulwidth = 0; //ulの横幅
311			var isAct = true;  //スライド機能を有効とするかどうか
312			// グローバルの再生状態を取得（初回はtrue）
313			var isPlay = sliderPlayStates[photo_id] !== undefined ? sliderPlayStates[photo_id] : true;
314			var isShown = false; //全部見えているかどうか
315			var processing = false; //処理中かどうかの判定フラグ（連打防止用）
316			var timeID; // ローカル変数として保持
317			
318			// aの中のimgにtabindexを付与しないヘルパー関数
319			function setSlideTabIndex($liList, activeIndex) {
320				// 全liをリセット
321				$liList.attr({'aria-hidden': true});
322				$liList.find('a').attr({'tabindex': -1});
323				// aを含まないliのimgのみtabindex=-1（aの中のimgにはtabindexをつけない）
324				$liList.each(function() {
325					if ($(this).find('a').length === 0) {
326						$(this).find('img').attr({'tabindex': -1});
327					} else {
328						// aの中のimgからtabindexを除去
329						$(this).find('a img').removeAttr('tabindex');
330					}
331				});
332				// 指定liをアクティブに
333				var $target = $liList.eq(activeIndex);
334				if ($target.find('a').length > 0) {
335					$target.attr({'aria-hidden': false}).find('a').attr({'tabindex': 0});
336				} else {
337					$target.attr({'aria-hidden': false}).find('img').attr({'tabindex': 0});
338				}
339			}
340			
341			//ページング画像とスライダー画像を結びつけるためのidの設定
342			if(!pg_hide_flg){
343				$(photo_id + ' ' + menu_id + ' .tmenu ul li').not('.clone').each(function(i,ele){ //画像側の処理
344					$(this).attr({
345						'id': panel_id + 'mvpanel' + (i+1),
346						'aria-labelledby': panel_id + 'mvtab' + (i+1),
347						//'aria-hidden': true,
348					});
349				});
350				
351				$(photo_id + ' .paging ul li button').each(function(i,ele){ //ボタン側の処理
352					$(this).attr({
353						'id': panel_id +'mvtab' + (i+1),
354						'aria-controls': panel_id +'mvpanel' + (i+1),
355						'aria-pressed': 'false',
356						'data-rel': (i+1),
357					})
358				});
359				
360				var firstBtn = $(photo_id + ' .paging ul li:first button');
361				firstBtn.find('img').attr('src', firstBtn.find('img').attr('src').replace('_off', '_on'))
362				firstBtn.attr({'aria-pressed': 'true'});
363			}
364			
365			// フォーカス、ホバー時の画像切り替え機能
366			$(photo_id + ' .pagingwrap  ul li button').on('focus mouseenter', function() {
367				var $img = $(this).find('img');
368				var currentSrc = $img.attr('src');
369				$img.attr('src', currentSrc.replace('_off', '_on'));
370			});
371			

372			// フォーカス、ホバーが外れた時の処理（元に戻す）
373			$(photo_id + ' .pagingwrap .paging ul li button').on('blur mouseleave', function() {
374				if ($(this).attr('aria-pressed') === 'false'){
375					var $img = $(this).find('img');
376					var currentSrc = $img.attr('src');
377					$img.attr('src', currentSrc.replace('_on', '_off'));
378				}
379			});
380			
381			// 自動スライド処理（右方向への移動）
382			var slideMenu = function(ct){ 
383				 // スライド機能が有効で、かつ処理中でない場合のみ実行
384				if(isAct && !processing){
385					processing = true;
386					var $first = $r_menu.children('li:first')
387					var left = $first.width() + parseInt($first.css('margin-left'), 10);
388					//リストの先頭を最後にコピーし、アニメーションした後、コピー元を消して座標をリセット
389					$r_menu.children('li:first').clone().appendTo($r_menu); //最初のバナーをコピーして最後に追加
390					$tmenu.animate({scrollLeft:left}, {
391						duration: 'slow',
392						complete: function(){
393							if(processing) {
394								$first.remove();
395								$tmenu.scrollLeft(0-left);
396								processing = false;
397							}
398						},
399						queue: false
400					});
401					toggleTabIndexR();
402				}
403				if(isAct && isPlay){
404					clearTimeout(timeID);
405					timeID = setTimeout(function(){
406						if(isPlay) {
407							slideMenu(null)
408						}
409					}, TP_SLIDE.time);
410					
411					// タイマーをグローバルに保存
412					sliderTimers[photo_id] = timeID;
413				}
414			}
415
416			//手動スライド処理（左方向への移動）
417			function backSlide(){
418				if(!processing && !isShown){
419					processing = true;
420					var $first = $r_menu.children('li:first')
421					var $last = $r_menu.children('li:last')
422					var left = $first.width() + parseInt($first.css('margin-left'), 10);
423					//リストの最後を先頭にコピーし座標を一つ分動かした後、アニメーションし、コピー元を消す
424					$last.clone().prependTo($r_menu);
425					$tmenu.scrollLeft(left);
426					//左右で若干初動速度が違うので、'slow:600'に対し780ミリ秒に調整
427					$tmenu.animate({scrollLeft:0-left}, {
428						duration: 780,
429						complete: function(){
430							if(processing) {
431								$last.remove();
432								processing = false;
433							}
434						},
435						queue: false
436					});
437					toggleTabIndexL();
438				}
439				return false;
440			}
441
442			//手動スライド処理（右方向への移動）
443			function nextSlide(){
444				if(!processing && !isShown){
445					processing = true;
446					var $first = $r_menu.children('li:first')
447					var left = $first.width() + parseInt($first.css('margin-left'), 10);
448					//リストの先頭を最後にコピーし、アニメーションした後、コピー元を消して座標をリセット
449					$r_menu.children('li:first').clone().appendTo($r_menu);
450					$tmenu.animate({scrollLeft:left}, {
451						duration: 'slow',
452						complete: function(){
453							if(processing) {
454								$first.remove();
455								$tmenu.scrollLeft(0-left);
456								processing = false;
457							}
458						},
459						queue: false
460					});
461					toggleTabIndexR();
462				}
463				return false;
464			}
465			
466			function judgeSlide(){
467				//スクロールしなくてもliの内容が全部見えている場合、スクロールさせる必要はないので、機能OFF
468				if(tmulwidth <= tmenuWidth){
469					//横幅が足りているとき
470					isAct = false;
471					isShown = true;
472					clearTimeout(timeID);
473					if (sliderTimers[photo_id]) {
474						clearTimeout(sliderTimers[photo_id]);
475						delete sliderTimers[photo_id];
476					}
477					//再生ボタンを非表示
478					$(photo_id + ' .btn').hide();
479					//矢印ボタンを非表示
480					$(photo_id + ' .scrollwrap').hide();
481					//ページングを非表示
482					$(photo_id + ' .pagingwrap').hide();
483					//クラス付与
484					$tmenu.addClass('shown');
485					$r_menu.css( 'width', 'calc(100% + ' + slideMarginLeft + 'px)');
486				}else if(!autplpay_flg){
487					//自動再生なしで横幅がはみ出ているとき
488					isAct = false;
489					isShown = false;
490					clearTimeout(timeID);
491					if (sliderTimers[photo_id]) {
492						clearTimeout(sliderTimers[photo_id]);
493						delete sliderTimers[photo_id];
494					}
495					//フォーカス設定
496					//矢印ボタン表示
497					$(photo_id + ' .scrollwrap').show();
498					//ページング表示
499					$(photo_id + ' .pagingwrap').show();
500					//クラス付与
501					$tmenu.removeClass('shown');
502					$r_menu.css( 'width', tmulwidth*3);
503				}else{
504					//自動再生ありで横幅がはみ出ているとき
505					isAct = true;
506					isShown = false;
507					//再生ボタンを表示
508					$(photo_id + ' .btn').show();
509					if(isPlay){
510						$(photo_id + ' .image_reel_stop').show().attr('aria-hidden', 'false');
511						$(photo_id + ' .image_reel_play').hide().attr('aria-hidden', 'true');
512						//初期自動再生
513						clearTimeout(timeID);
514						if (sliderTimers[photo_id]) {
515							clearTimeout(sliderTimers[photo_id]);
516							delete sliderTimers[photo_id];
517						}
518						timeID = setTimeout(function(){slideMenu(null)}, TP_SLIDE.time,null);
519						sliderTimers[photo_id] = timeID;
520					}else{
521						$(photo_id + ' .image_reel_stop').hide().attr('aria-hidden', 'true');
522						$(photo_id + ' .image_reel_play').show().attr('aria-hidden', 'false');
523					}
524					//矢印ボタン表示
525					$(photo_id + ' .scrollwrap').show();
526					//ページング表示
527					$(photo_id + ' .pagingwrap').show();
528					//クラス付与
529					$tmenu.removeClass('shown');
530					$r_menu.css( 'width', tmulwidth*3);
531				}
532			}
533			
534			//スライドの幅を指定
535			function widthSlide(photo_id) {
536				// オリジナルのli要素のみ取得（cloneを除外）
537				var $r_menu_children = get_r_menu_children();

538				
539				//リセット
540				$r_menu_children.css('width', '');
541				$r_menu.css('transform', 'translateX(0px)');
542				
543				//余白分ulを左にずらす
544				slideMarginLeft = parseFloat($r_menu_children.first().css('margin-left'));
545				if(slideMarginLeft == 0){
546					$r_menu.css('margin-left', 0);
547				}else{
548					$r_menu.css('margin-left', slideMarginLeft * -1 + 'px');
549				}
550				
551				// liに指定されているCSSのwidthを取得してスライドの幅を計算
552				var defaultSlideSize = $r_menu_children.first().outerWidth();
553				var slidePercent = defaultSlideSize / $r_menu.outerWidth();
554				
555				//横幅を再取得
556				tmenuWidth = $tmenu.width();
557				slideMarginLeft = parseFloat($r_menu_children.first().css('margin-left'));
558				
559				//スライドの幅を計算
560				var slideOuterWidth = tmenuWidth * slidePercent;
561				
562				//スライドの枚数を計算
563				var rawCount = tmenuWidth / slideOuterWidth;
564				slideCount = Math.abs(rawCount - Math.round(rawCount)) < 0.01 
565				    ? Math.round(rawCount) 
566				    : Math.floor(rawCount);
567				
568				//スライド1枚の場合再計算
569				if (slideCount == 1) {
570					defaultSlideSize = $r_menu_children.first().outerWidth(true);
571					slidePercent = defaultSlideSize / $r_menu.outerWidth(true);
572				}
573				
574				//liを再取得
575				//$r_menu_children = $(photo_id + ' ' + menu_id + ' .tmenu ul').children('li');
576				
577				//スライドの幅を指定
578				slideWidth = (tmenuWidth + slideMarginLeft) * slidePercent - slideMarginLeft;
579				$r_menu_children.css('width', slideWidth + 'px');
580				
581				//ulの幅を再計算
582				tmulwidth = 0;
583				$r_menu_children.each(function(){
584					tmulwidth = tmulwidth + $(this).outerWidth(true);
585				});
586				tmulwidth = tmulwidth - slideMarginLeft;//一番左のマージンは除く
587				$r_menu.css( 'width', tmulwidth*3);
588				
589				//高さを挿入
590				var slideHeight = $r_menu_children.first().outerHeight();
591				$tmenu.css( 'height', slideHeight);
592			}
593			
594			//1枚目のスライドの位置設定
595			function firstSlide(photo_id, targetIndex) {
596				
597				if (!isShown) {
598					//スライド2枚分左にずらす
599					var slidePosition = (slideWidth + slideMarginLeft) * 2 * -1;
600					var extendX = 0;
601					
602					//前後スライドありの場合
603					if($(photo_id).hasClass('extend')){
604						if($(photo_id).hasClass('overhalf')){
605							//半分以上はみ出す場合はslideCountを減らす
606							slideCount = slideCount - 1 ;
607						}
608						//tmenuに収まるスライドの幅を除いた余りを計算
609						if (slideCount <= 1) {
610							extendX = (tmenuWidth - slideWidth) / 2;
611							slidePosition = slidePosition + extendX;
612						}else{
613							extendX = (tmenuWidth - ((slideWidth + slideMarginLeft) * slideCount)) / 2 - slideMarginLeft / 2;
614							slidePosition = slidePosition + extendX + slideMarginLeft;
615						}
616					}
617					
618					//中央開始の場合
619					if($(photo_id).hasClass('center')){
620						//中央のスライドより前のスライドの幅分ずらす
621						var centerSlideIndex = Math.floor(slideCount / 2);
622						centerX = (slideWidth + slideMarginLeft) * centerSlideIndex;
623						slidePosition = slidePosition + centerX;
624					}
625					
626					//ulを左にずらす
627					$r_menu.css('transform', 'translateX(' + slidePosition + 'px)');
628					
629				}
630			}
631			
632			//スライダー初期処理
633			function resetSlider(photo_id) {
634				
635				// タイマーをクリア
636				clearTimeout(timeID);
637				if (sliderTimers[photo_id]) {
638					clearTimeout(sliderTimers[photo_id]);
639					delete sliderTimers[photo_id];
640				}
641				
642				// 現在表示中のスライド位置を取得
643				var currentIndex = sliderCurrentPositions[photo_id];
644				if (currentIndex === undefined) {
645					currentIndex = 0;
646					sliderCurrentPositions[photo_id] = 0;
647				}
648				
649				// クローンを全削除
650				$r_menu.children('li.clone').remove();
651				
652				// オリジナルを並べ替え＆回転
653				var $originalItems = $r_menu.children('li').detach();
654				$originalItems.sort(function(a, b) {
655					return parseInt($(a).attr('data-original-index')) - parseInt($(b).attr('data-original-index'));
656				});
657				var itemsArray = $originalItems.toArray();
658				var rotatedItems = itemsArray.slice(currentIndex).concat(itemsArray.slice(0, currentIndex));
659				$r_menu.append($(rotatedItems));
660				
661				//スライドサイズ判定
662				widthSlide(photo_id);
663				judgeSlide();
664				
665				//クローンの追加
666				if (!isShown) {
667					var $r_menu_children = get_r_menu_children();

668					$r_menu_children.last().clone().addClass('clone').prependTo($r_menu);
669					$r_menu_children.eq($r_menu_children.length - 2).clone().addClass('clone').prependTo($r_menu);
670					$r_menu_children.slice(0, -2).clone().addClass('clone').appendTo($r_menu);
671				}
672				
673				//クローンした要素のIDを変更
674				var clone_menu = $r_menu.children('li.clone');
675				clone_menu.each(function(){
676					var clone_id = $(this).attr('id');
677					var clone_labelledby = $(this).attr('aria-labelledby');
678					if (clone_id){
679						$(this).attr('id', clone_id + '_clone');
680					}
681					if (clone_labelledby){
682						$(this).attr('aria-labelledby', clone_labelledby + '_clone');
683					}
684				});
685				
686				$r_menu.children('li.clone').css('width', slideWidth + 'px');
687				
688				//スライド開始位置設定
689				firstSlide(photo_id);
690				
691				//フォーカス設定
692				if (!isShown) {
693					var $allLi = $(photo_id + ' ' + menu_id + ' .tmenu ul li');
694					setSlideTabIndex($allLi, 2);
695				} else {
696					setTabIndex();
697				}
698				
699				// ページングボタンの状態を更新
700				if (!pg_hide_flg) {
701					// 全てのボタンをリセット
702					$(photo_id + ' .paging ul li button').attr({'aria-pressed': 'false'});
703					btnReset(photo_id);
704					
705					// 現在位置のボタンを選択状態に
706					var $pagingButtons = $(photo_id + ' .paging ul li button');
707					var $currentBtn = $pagingButtons.eq(currentIndex);
708					$currentBtn.attr({'aria-pressed': 'true'});
709					var currentSrc = $currentBtn.find('img').attr('src');
710					$currentBtn.find('img').attr('src', currentSrc.replace('_off', '_on'));
711					
712				}
713				
714			}
715			
716			// resetSlider関数を外部から呼べるようにデータ属性に保存
717			$(photo_id).data('resetSlider', function() {
718				resetSlider(photo_id);
719			});
720			
721			//------------------------------------------------------------
722			//tabindex,aria-hiddenの切り替え
723			//------------------------------------------------------------
724			//右にスライドした時
725			function toggleTabIndexR() {
726				//スクロール画像のtabindexの切り替え（一度全部に-1つけてから三番目のみ0つける）
727				var $focusitem = $(photo_id + ' ' + menu_id + ' .tmenu ul li');
728				setSlideTabIndex($focusitem, 3);
729				
730				// 現在位置を計算で更新
731				var currentIndex = sliderCurrentPositions[photo_id] || 0;
732				var newIndex = (currentIndex + 1) % totalSlides;
733				sliderCurrentPositions[photo_id] = newIndex;
734
735				//ページング画像のtabindexの切り替え（一度全部に-1つけてから三番目のみ0つける）
736				if (!pg_hide_flg){
737					$(photo_id + ' .paging ul li button').attr({'aria-pressed': 'false'});
738					var $pagingButtons = $(photo_id + ' .paging ul li button');
739					$pagingButtons.eq(newIndex).attr({'aria-pressed': 'true'});
740					
741					btnReset(photo_id);//ページングボタンを全てoffに
742					
743					//選択中のぺージボタン切替
744					var pagingBtn = $pagingButtons.eq(newIndex);
745					var currentSrc = pagingBtn.find('img').attr('src');
746					pagingBtn.find('img').attr('src', currentSrc.replace('_off', '_on'))
747				}
748			}
749
750			//左にスライドした時
751			function toggleTabIndexL() {
752				//スクロール画像のtabindexの切り替え（一度全部に-1つけてから二番目のみ0つける）
753				var $focusitem = $(photo_id + ' ' + menu_id + ' .tmenu ul li');
754				setSlideTabIndex($focusitem, 2);
755				
756				// 現在位置を計算で更新
757				var currentIndex = sliderCurrentPositions[photo_id] || 0;
758				var newIndex = (currentIndex - 1 + totalSlides) % totalSlides;
759				sliderCurrentPositions[photo_id] = newIndex;
760
761				//ページング画像のtabindexの切り替え（一度全部に-1つけてから二番目のみ0つける）
762				if (!pg_hide_flg){
763					$(photo_id + ' .paging ul li button').attr({'aria-pressed': 'false'});
764					var $pagingButtons = $(photo_id + ' .paging ul li button');
765					$pagingButtons.eq(newIndex).attr({'aria-pressed': 'true'});
766					
767					btnReset(photo_id);//ページングボタンを全てoffに
768					
769					//選択中のぺージボタン切替
770					var pagingBtn = $pagingButtons.eq(newIndex);
771					var currentSrc = pagingBtn.find('img').attr('src');
772					pagingBtn.find('img').attr('src', currentSrc.replace('_off', '_on'))
773				}
774			}
775			
776			//------------------------------------------------------------
777			//左右送りボタンのイベント
778			//------------------------------------------------------------
779			//左右送りの＜をクリックしたとき
780			$(photo_id + ' .back button').on('click', function() {

781				backSlide();
782			});
783
784			//左右送りの＞をクリックしたとき
785			$(photo_id + ' .next button').on('click', function() {
786				nextSlide();
787			});			
788			
789			// キーボード操作で＜を押したとき
790			$(photo_id + ' .back button').on('keydown', function(e) {
791				// Enter キーが押された場合と左矢印を押した場合
792				if (e.keyCode === 13 || e.keyCode === 37) {
793					e.preventDefault(); // デフォルトの動作を防止
794					backSlide();
795					var $focusitem = $(photo_id + ' ' + menu_id + ' .tmenu ul li')
796					if($focusitem.eq(2).find("a").length > 0){
797						//スクロール画像にリンクがかかっていた場合
798						$focusitem.eq(2).find("a").trigger("focus");
799					}else{
800						//スクロール画像にリンクがかかってない場合
801						$focusitem.eq(2).find("img").trigger("focus");
802					}	
803				}
804			});
805
806			// キーボード操作で＞を押したとき
807			$(photo_id + ' .next button').on('keydown', function(e) {
808				//  Enter キーが押された場合と右矢印を押した場合
809				if (e.keyCode === 13 || e.keyCode === 39) {
810					e.preventDefault(); // デフォルトの動作を防止
811					nextSlide();
812					var $focusitem = $(photo_id + ' ' + menu_id + ' .tmenu ul li')
813					if($focusitem.eq(3).find("a").length > 0){
814						//スクロール画像にリンクがかかっていた場合
815						$focusitem.eq(3).find("a").trigger("focus");
816					}else{
817						//スクロール画像にリンクがかかってない場合
818						$focusitem.eq(3).find("img").trigger("focus");
819					}
820				}
821			});
822
823			//キーボード操作したらアニメーションを停止
824			$(photo_id).each(function(){
825				$(this).on("keydown",function(e){
826					$(photo_id + ' .image_reel_stop').hide().attr('aria-hidden', 'true');
827					$(photo_id + ' .image_reel_play').show().attr('aria-hidden', 'false');
828					clearTimeout(timeID);
829					if (sliderTimers[photo_id]) delete sliderTimers[photo_id];
830					isPlay = false;
831					sliderPlayStates[photo_id] = false;
832				});
833			});
834
835			//再生・停止ボタンでtabキーが押された時の処理
836			if (!pg_hide_flg){
837				$(photo_id + ' .image_reel_play, ' + photo_id + ' .image_reel_stop').on('keydown', function(e) {
838					if (e.keyCode === 9 && !e.shiftKey) { // tabキーが押された場合（シフトなし）
839						e.preventDefault(); // デフォルトのタブ移動を防止
840						
841						//aria-hidden ="false"のスライドにフォーカスをあてる
842						var $focusimg = $(photo_id + ' ' + menu_id + ' .tmenu ul li[aria-hidden="false"]');
843						if ($focusimg.find('img').length > 0) {
844							$focusimg.find('img').trigger("focus");
845						}
846					}
847				});
848			}
849			//------------------------------------------------------------
850			//ページングボタン
851			//------------------------------------------------------------
852			//ページングボタンを全てoffに
853			function btnReset(slide_id) {
854				var $img = $(slide_id + ' .paging ul li button img');
855				var currentSrc = $img.attr('src');
856				$img.attr('src', currentSrc.replace('_on', '_off'));
857			}
858
859			// 共通処理を関数化（フォーカス処理のフラグを追加）
860			function handlePagingAction($button, shouldFocus) {
861				if(!processing){
862					var indexView = 0;
863					var index = $button.parent().index() + 1;
864					var indexBtn = $(photo_id + ' .paging li button[aria-pressed="true"]').parent().index() + 1; //現在のボタン位置
865					
866					//初期化処理
867					$(photo_id + ' .paging ul li button').attr({'aria-pressed': 'false'});
868					$button.attr({'aria-pressed': 'true'});
869					btnReset(photo_id);
870					var pagingBtn = $(photo_id + ' .paging ul li button[aria-pressed="true"]');
871					var currentSrc = pagingBtn.find('img').attr('src');
872					pagingBtn.find('img').attr('src', currentSrc.replace('_off', '_on'))
873					
874					// フォーカスを当てる関数（shouldFocusがtrueの場合のみ実行）
875					function focusOnSlideImage() {
876						if (shouldFocus) {
877							// aria-hidden="false"の要素を探してフォーカス
878							var $visibleItem = $(photo_id + ' ' + menu_id + ' .tmenu ul li[aria-hidden="false"]');
879							if($visibleItem.find("a").length > 0){
880								//スクロール画像にリンクがかかっていた場合
881								$visibleItem.find("a").trigger("focus");
882							}else{
883								//スクロール画像にリンクがかかってない場合
884								$visibleItem.find("img").trigger("focus");
885							}
886						}
887					}
888					
889					if (index > indexBtn){
890						indexView = index - indexBtn;
891						if(indexView == 1){
892							nextSlide();
893							// 現在位置を更新(index - 1は0-basedインデックス)
894							sliderCurrentPositions[photo_id] = index - 1;
895							// アニメーション完了後にフォーカスを設定（shouldFocusがtrueの場合のã

895¿ï¼‰
896							if (shouldFocus) {
897								setTimeout(focusOnSlideImage, 600); // 'slow'のデフォルト時間に合わせる
898							}
899						}else{
900							if(!processing && !isShown){
901								processing = true;
902								var cloneLi = [];
903								var $first = $r_menu.children('li:first')
904								var slideWidth  = $first.width() + parseInt($first.css('margin-left'), 10);
905								var moveDistance  = slideWidth * indexView;
906								//リストの先頭を最後にコピーし、アニメーションした後、コピー元を消して座標をリセット
907								for (var i = 0; i < indexView; i++) {
908									$r_menu.children('li').eq(i).clone().appendTo($r_menu);
909									cloneLi.push($r_menu.children('li').eq(i));
910								}
911								$tmenu.animate({scrollLeft:moveDistance}, {
912									duration: 'slow',
913									complete: function(){
914										if(processing) {
915											$.each(cloneLi,function(){
916												$(this).remove();
917											});
918											$tmenu.scrollLeft(0-slideWidth);
919											processing = false;
920											// 現在位置を更新(index - 1は0-basedインデックス)
921											sliderCurrentPositions[photo_id] = index - 1;
922											//スクロール画像のtabindexの切り替え（一度全部に-1つけてから三番目のみ0つける）
923											var $focusitem = $(photo_id + ' ' + menu_id + ' .tmenu ul li');
924											setSlideTabIndex($focusitem, 2);
925											
926											// アニメーション完了後にフォーカス（shouldFocusがtrueの場合のみ）
927											if (shouldFocus) {
928												var $visibleItem = $(photo_id + ' ' + menu_id + ' .tmenu ul li[aria-hidden="false"]');
929												if($visibleItem.find("a").length > 0){
930													$visibleItem.find("a").trigger("focus");
931												}else{
932													$visibleItem.find("img").trigger("focus");
933												}
934											}
935										}
936									},
937									queue: false
938								});

939							}
940						}
941					}else if(index < indexBtn){
942						indexView = indexBtn - index;
943						if(indexView == 1){
944							backSlide();
945							// 現在位置を更新(index - 1は0-basedインデックス)
946							sliderCurrentPositions[photo_id] = index - 1;
947							// アニメーション完了後にフォーカスを設定（shouldFocusがtrueの場合のみ）
948							if (shouldFocus) {
949								setTimeout(focusOnSlideImage, 780); // backSlideの時間に合わせる
950							}
951						}else{
952							if(!processing && !isShown){
953								processing = true;
954								var cloneLi = [];
955								var $first = $r_menu.children('li:first')
956								var $last = $r_menu.children('li:last')
957								var slideWidth = $first.width() + parseInt($first.css('margin-left'), 10);
958								var moveDistance  = slideWidth * indexView;
959								//リストの最後を先頭にコピーし座標を一つ分動かした後、アニメーションし、コピー元を消す
960								for (var i = 0; i < indexView; i++) {
961									var lengthLi = $r_menu.children('li').length - 1;
962									cloneLi.push($r_menu.children('li').eq(lengthLi - i));
963									$r_menu.children('li').eq(lengthLi - i).addClass("remove");
964									$r_menu.children('li').eq(lengthLi - i).clone().removeClass("remove").prependTo($r_menu);
965								}
966								$tmenu.scrollLeft(moveDistance);
967								//左右で若干初動速度が違うので、'slow:600'に対し780ミリ秒に調整
968								$tmenu.animate({scrollLeft:0-moveDistance}, {
969									duration: 780,
970									complete: function(){
971										if(processing) {
972											$.each(cloneLi,function(){
973												$(this).remove();
974											});
975											processing = false;
976											// 現在位置を更新(index - 1は0-basedインデックス)
977											sliderCurrentPositions[photo_id] = index - 1;
978											//スクロール画像のtabindexの切り替え（一度全部に-1つけてから三番目のみ0つける）
979											var $focusitem = $(photo_id + ' ' + menu_id + ' .tmenu ul li');
980											setSlideTabIndex($focusitem, 2);
981											
982											// アニメーション完了後にフォーカス（shouldFocusがtrueの場合のみ）
983											if (shouldFocus) {
984												var $visibleItem = $(photo_id + ' ' + menu_id + ' .tmenu ul li[aria-hidden="false"]');
985												if($visibleItem.find("a").length > 0){
986													$visibleItem.find("a").trigger("focus");
987												}else{
988													$visibleItem.find("img").trigger("focus");
989												}
990											}
991										}
992									},
993									queue: false
994								});

995							}
996						}
997					} else {
998						// 同じボタンがクリック/エンターされた場合（shouldFocusがtrueの場合のみフォーカス）
999						// 現在位置を更新(念のため)
1000						sliderCurrentPositions[photo_id] = index - 1;
1001						focusOnSlideImage();
1002					}
1003				}
1004			}
1005
1006			//------------------------------------------------------------
1007			//ページングボタンのキーボード操作
1008			//------------------------------------------------------------
1009			// ページング画像上でクリックしたとき（フォーカスしない）
1010			$(photo_id + ' .paging li button').on('click', function() {
1011				handlePagingAction($(this), false);
1012			});
1013
1014			// ページング画像上でキーボード操作したとき
1015			$(photo_id + ' .paging li button').on('keydown', function(e) {
1016				var $buttons = $(photo_id + ' .paging li button');
1017				var currentIndex = $buttons.index(this);
1018				var $currentButton = $(this);
1019				
1020				// 右矢印キー（→） 次のボタンにフォーカスを移動
1021				if (e.keyCode === 39) {
1022					e.preventDefault();
1023					var nextIndex = (currentIndex + 1) % $buttons.length; // 最後の場合は最初に戻る
1024					var $nextButton = $buttons.eq(nextIndex);
1025					$nextButton.focus();
1026				}
1027				// 左矢印キー（←） 前のボタンにフォーカスを移動
1028				else if (e.keyCode === 37) {
1029					e.preventDefault();
1030					var prevIndex = (currentIndex - 1 + $buttons.length) % $buttons.length; // 最初の場合は最後に移動
1031					var $prevButton = $buttons.eq(prevIndex);
1032					$prevButton.focus();
1033				}
1034				// Enterキー // 画像にフォーカスを移動（フォーカスする）
1035				else if (e.keyCode === 13) {
1036					e.preventDefault();
1037					handlePagingAction($currentButton, true);
1038				}
1039				// Tabキーの処理（既存の処理と統合）
1040				else if (e.keyCode === 9) {
1041					var $buttons = $(photo_id + ' .paging li button');
1042					var currentIndex = $buttons.index(this);
1043
1044					// Shiftキーと一緒に押された場合（後ろに戻る）
1045					if (e.shiftKey) {
1046						// 最初のボタンでShift+Tabが押された場合
1047						if (currentIndex === 0) {
1048							e.preventDefault();
1049							// aria-hidden="false"のli要素内のフォーカス可能な要素にフォーカス
1050							var $focusimg = $(photo_id + ' ' + menu_id + ' .tmenu ul li[aria-hidden="false"]');
1051							if ($focusimg.find('img').length) {
1052								$focusimg.find('img').focus();
1053							}
1054						}
1055					}
1056				}
1057			});
1058			
1059			//------------------------------------------------------------
1060			//画像上でのキーボード操作
1061			//------------------------------------------------------------
1062			// 親要素にイベント委譲で設定（DOM変更に強い）
1063			$(photo_id)
1064				.off('keydown.sliderArrow', menu_id + ' .tmenu ul li img, ' + menu_id + ' .tmenu ul li a')
1065				.on('keydown.sliderArrow', menu_id + ' .tmenu ul li img, ' + menu_id + ' .tmenu ul li a', function(e) {
1066				//ページング処理使用時の画像からtabキー操作処理
1067				if (!pg_hide_flg){
1068					if (e.keyCode === 9) { // tabキーが押された場合（シフトなし）
1069						if (!isShown && !e.shiftKey){
1070							e.preventDefault(); // デフォルトのタブ移動を防止
1071							
1072							// aria-pressed="true"のページングボタンに直接フォーカス
1073							var $selectedPagingBtn = $(photo_id + ' .paging li button[aria-pressed="true"]');
1074							if ($selectedPagingBtn.length > 0) {
1075								$selectedPagingBtn.focus();
1076							}
1077						}
1078					}
1079				}
1080				// 右矢印キー（→）
1081				if (e.keyCode === 39) {
1082					e.preventDefault();
1083					// スライダーモードでは常にnextSlide()を使用（クローン処理は内部で適切に処理される）
1084					if (!isShown && !processing) {
1085						nextSlide();
1086						setTimeout(function() {
1087							var $visibleItem = $(photo_id + ' ' + menu_id + ' .tmenu ul li[aria-hidden="false"]');
1088							if($visibleItem.find("a").length > 0){
1089								$visibleItem.find("a").trigger("focus");
1090							}else{
1091								$visibleItem.find("img").trigger("focus");
1092							}
1093						}, 600);
1094					}
1095				}
1096				// 左矢印キー（←）
1097				else if (e.keyCode === 37) {
1098					e.preventDefault();
1099					// スライダーモードでは常にbackSlide()を使用（クローン処理は内部で適切に処理される）
1100					if (!isShown && !processing) {

1101						backSlide();
1102						setTimeout(function() {
1103							var $visibleItem = $(photo_id + ' ' + menu_id + ' .tmenu ul li[aria-hidden="false"]');
1104							if($visibleItem.find("a").length > 0){
1105								$visibleItem.find("a").trigger("focus");
1106							}else{
1107								$visibleItem.find("img").trigger("focus");
1108							}
1109						}, 780);
1110					}
1111				}
1112			});
1113
1114			//------------------------------------------------------------
1115			//スマートフォンのスワイプ
1116			//------------------------------------------------------------
1117			/** 指が触れたか */
1118			$r_menu.on("touchstart", start_check);
1119
1120			/** 指が動いたか */
1121			$r_menu.on("touchmove", move_check);
1122
1123			/** 指が離れたか */
1124			$r_menu.on("touchend", function() {
1125				isSwiping = false;
1126			});
1127
1128			/** 変数 */
1129			var moveY, moveX, posiY, posiX;
1130			var isSwiping = false;
1131			var startTime;
1132
1133			//タッチ開始時の処理
1134			function start_check(event){
1135				if (!processing) {
1136					/** 現在の座標取得 */
1137					posiY = getY(event);
1138					posiX = getX(event);
1139					startTime = new Date().getTime();
1140					isSwiping = true;
1141					/** 移動距離状態を初期化 */
1142					moveY = '';
1143					moveX = '';
1144				}
1145			}
1146
1147			//スワイプ中の処理
1148			function move_check(event){
1149				if (!isSwiping || processing) {
1150					return;
1151				}
1152				
1153				var currentX = getX(event);
1154				var distance = posiX - currentX;
1155				var currentTime = new Date().getTime();
1156				var elapsedTime = currentTime - startTime;
1157				
1158				// スワイプ速度を計算
1159				var swipeVelocity = Math.abs(distance) / elapsedTime;
1160				
1161				if (Math.abs(distance) > 40 && swipeVelocity > 0.2) { // 速度のしきい値を追加
1162					isSwiping = false;
1163					if (distance > 0) {
1164						nextSlide();
1165					} else {

1166						backSlide();
1167					}
1168				}
1169			}
1170
1171			// 座標取得処理
1172			function getY(event){
1173				//縦方向の座標を取得
1174				return (event.originalEvent.touches[0].pageY);
1175			}
1176			function getX(event){
1177				//横方向の座標を取得
1178				return (event.originalEvent.touches[0].pageX);
1179			}
1180
1181			//------------------------------------------------------------
1182			//再生・停止ボタン
1183			//------------------------------------------------------------
1184			//停止ボタンを押したらアニメーションを停止
1185			$(photo_id + ' .image_reel_stop').on('click', function() {
1186				$(photo_id + ' .image_reel_play').attr('aria-hidden', 'false').show().trigger("focus");
1187				$(photo_id + ' .image_reel_stop').hide().attr('aria-hidden', 'true');
1188				clearTimeout(timeID);
1189				if (sliderTimers[photo_id]) delete sliderTimers[photo_id];
1190				isPlay = false;
1191				sliderPlayStates[photo_id] = false;
1192				return false;
1193			});
1194
1195			//再生ボタンを押したらアニメーションを再生
1196			$(photo_id + ' .image_reel_play').on('click', function() {
1197				$(photo_id + ' .image_reel_stop').attr('aria-hidden', 'false').show().trigger("focus");
1198				$(photo_id + ' .image_reel_play').hide().attr('aria-hidden', 'true');
1199				isPlay = true;
1200				sliderPlayStates[photo_id] = true;
1201				clearTimeout(timeID);
1202				slideMenu();
1203				return false;
1204			});
1205
1206			//------------------------------------------------------------
1207			// ウインドウリサイズ時の処理（個別スライダー用）
1208			//------------------------------------------------------------
1209			var timer = false;
1210			var timer2 = false;
1211			var currentWidth = window.innerWidth;
1212			$(window).on('resize', function() {
1213				if (currentWidth == window.innerWidth) {
1214					// ウインドウ横幅が変わっていない場合は処理をキャンセル
1215					return;
1216				}
1217				currentWidth = window.innerWidth;
1218				if (timer !== false) {
1219					clearTimeout(timer);
1220				}
1221				if (timer2 !== false) {
1222					clearTimeout(timer2);
1223				}
1224				timer = setTimeout(function() {
1225					resetSlider(photo_id);
1226				}, 200);
1227				timer2 = setTimeout(function() {
1228					resetSlider(photo_id);
1229				}, 500);
1230			});
1231
1232			//------------------------------------------------------------
1233			// ビューモード切替時の処理
1234			//------------------------------------------------------------
1235			$('#viewmode_smp, #viewmode_pc').on('click', function() {
1236				if (timer !== false) {
1237					clearTimeout(timer);
1238				}
1239				if (timer2 !== false) {
1240					clearTimeout(timer2);
1241				}
1242				timer = setTimeout(function() {
1243					resetSlider(photo_id);
1244				}, 200);
1245				timer2 = setTimeout(function() {
1246					resetSlider(photo_id);
1247				}, 500);
1248			});
1249
1250			//------------------------------------------------------------
1251			// 初期処理
1252			//------------------------------------------------------------
1253			$(photo_id).show();
1254			var tmenuWidth = $tmenu.width();//枠の幅を取得
1255			var slideWidth;
1256			var slideCount;
1257			var slideMarginLeft = parseFloat(get_r_menu_children().first().css('margin-left'));
1258			var ulPaddingLeft = parseFloat($r_menu.css('padding-left'));
1259			var ulPaddingRight = parseFloat($r_menu.css('padding-right'));
1260			var ulPaddingTop = parseFloat($r_menu.css('padding-top'));
1261			var ulPaddingBottom = parseFloat($r_menu.css('padding-bottom'));
1262			var ulHorizontalPadding = ulPaddingLeft + ulPaddingRight;
1263			var ulVerticalPadding = ulPaddingTop + ulPaddingBottom;
1264			
1265			//表示スタイルの補正
1266			$tmenu.css( 'overflow', 'hidden');
1267			get_r_menu_children().each(function(){
1268				tmulwidth = tmulwidth + $(this).outerWidth(true);
1269			});
1270			tmulwidth = tmulwidth - slideMarginLeft;//一番左のマージンは除く
1271			$r_menu.css( 'width', tmulwidth*3);
1272
1273			//スライダーの横幅の処理
1274			resetSlider(photo_id);
1275			if (timer !== false) {
1276				clearTimeout(timer);
1277			}
1278			if (timer2 !== false) {
1279				clearTimeout(timer2);
1280			}
1281			timer = setTimeout(function() {
1282				resetSlider(photo_id);
1283			}, 200);
1284			timer2 = setTimeout(function() {
1285				resetSlider(photo_id);
1286			}, 500);
1287
1288			//＜＞の関連付け
1289			if($(photo_id + ' .back button, ' + photo_id + ' .next button').length > 0) {
1290				$(photo_id + ' .back button').attr({'aria-controls': tmenu_id });
1291				$(photo_id + ' .next button').attr({'aria-controls': tmenu_id });
1292				$(photo_id + ' .tmenu').attr({'id': tmenu_id });
1293			}
1294
1295			//tabindexの設定
1296			function setTabIndex() {

1297				var $focusitem = $(photo_id + ' ' + menu_id + ' .tmenu ul li');
1298				if (isShown) {
1299					$focusitem.attr({'aria-hidden': false});
1300					$focusitem.find('a').attr('tabindex', '0');
1301					$focusitem.find('img:not(a img)').attr('tabindex', '0');
1302				}else{
1303					//リストの先頭のみフォーカスできるようにする
1304					$focusitem.attr({'aria-hidden': true});
1305					$focusitem.find('a').attr('tabindex', '-1');
1306					$focusitem.find('img:not(a img)').attr('tabindex', '-1');
1307					if($focusitem.eq(2).find("a").length > 0){
1308						//スクロール画像にリンクがかかっていた場合
1309						$focusitem.eq(2).attr({'aria-hidden': false}).find("a").attr({'tabindex': 0});
1310					}else{
1311						//スクロール画像にリンクがかかってない場合
1312						$focusitem.eq(2).attr({'aria-hidden': false}).find("img").attr({'tabindex': 0});
1313					}
1314				}
1315			}
1316			
1317			// resetSlider関数を外部から呼べるように保存
1318			sliderResetFunctions[photo_id] = function() {
1319				resetSlider(photo_id);
1320			};
1321		}
1322	 });
1323
1324})();