// 要素を取得
const thumbnail = document.querySelector('.video-thumbnail video');
const modal = document.getElementById('videoModal');
const modalVideo = document.getElementById('modalVideo');
const closeButton = document.querySelector('.close-button');
// サムネイル動画をクリックしたときのイベント
thumbnail.addEventListener('click', () => {
modal.style.display = 'flex'; // モーダルを表示
modalVideo.play(); // 動画を再生
});
// モーダルの閉じるボタンをクリックしたとき
closeButton.addEventListener('click', () => {
modal.style.display = 'none'; // モーダルを非表示
modalVideo.pause(); // 動画を停止
modalVideo.currentTime = 0; // 動画をリセット
});
// モーダルの背景をクリックして閉じる
modal.addEventListener('click', (event) => {
if (event.target === modal) {
modal.style.display = 'none';
modalVideo.pause();
modalVideo.currentTime = 0;
}
});