「MediaWiki:Common.js」の版間の差分

← 古い編集

MediaWiki:Common.js (ソースを閲覧)

2026年9月2日 (水) 10:18時点における版

2,592 バイト追加、 2026年9月2日 (水)

編集の要約なし

ド馬

ビューロクラット、インターフェース管理者、管理者

2,720

回編集

@@ 120行目: / 120行目: @@
 	updateButtons();
 	});
+});
+/* =========================================================
+ * Infobox 画像スライダー
+ * ========================================================= */
+mw.hook('wikipage.content').add(function ($content) {
+	$content.find('.ts-infobox-slider').each(function () {
+	var slider = this;
+	/* 二重初期化を防止 */
+	if (slider.dataset.infoboxSliderReady === '1') {
+	return;
+	}
+	slider.dataset.infoboxSliderReady = '1';
+	var track =
+	slider.querySelector('.ts-infobox-slider__track');
+	if (!track) {
+	return;
+	}
+	var slides =
+	track.querySelectorAll('.ts-infobox-slider__slide');
+	if (!slides.length) {
+	return;
+	}
+	/*
+	* 1枚だけなら矢印を作らない
+	*/
+	if (slides.length === 1) {
+	slider.classList.add(
+	'ts-infobox-slider--single'
+	);
+	return;
+	}
+	/* -----------------------------------------
+	  戻るボタン
+	  ----------------------------------------- */
+	var prev =
+	document.createElement('button');
+	prev.type = 'button';
+	prev.className =
+	'ts-infobox-slider__nav ' +
+	'ts-infobox-slider__prev';
+	prev.innerHTML = '&#8249;';
+	prev.setAttribute(
+	'aria-label',
+	'前の画像'
+	);
+	/* -----------------------------------------
+	  次へボタン
+	  ----------------------------------------- */
+	var next =
+	document.createElement('button');
+	next.type = 'button';
+	next.className =
+	'ts-infobox-slider__nav ' +
+	'ts-infobox-slider__next';
+	next.innerHTML = '&#8250;';
+	next.setAttribute(
+	'aria-label',
+	'次の画像'
+	);
+	slider.appendChild(prev);
+	slider.appendChild(next);
+	/* -----------------------------------------
+	  ボタン状態
+	  ----------------------------------------- */
+	function updateButtons() {
+	var max =
+	track.scrollWidth -
+	track.clientWidth;
+	prev.disabled =
+	track.scrollLeft <= 3;
+	next.disabled =
+	track.scrollLeft >= max - 3;
+	}
+	/* -----------------------------------------
+枚分移動
+	  ----------------------------------------- */
+	function move(direction) {
+	track.scrollBy({
+	left:
+	direction *
+	track.clientWidth,
+	behavior: 'smooth'
+	});
+	}
+	prev.addEventListener(
+	'click',
+	function () {
+	move(-1);
+	}
+	);
+	next.addEventListener(
+	'click',
+	function () {
+	move(1);
+	}
+	);
+	track.addEventListener(
+	'scroll',
+	function () {
+	window.requestAnimationFrame(
+	updateButtons
+	);
+	},
+	{
+	passive: true
+	}
+	);
+	window.addEventListener(
+	'resize',
+	updateButtons
+	);
+	updateButtons();
+	});
 });