Sleeper·2026년 2월 20일

(function() {
function initTabKeyNav() {
const container = document.querySelector('.tabContainer3');
if (!container) {
setTimeout(initTabKeyNav, 500);
return;
}
const tabList = container.querySelector('ul.mx-tabcontainer-tabs');
if (!tabList) {
setTimeout(initTabKeyNav, 500);
return;
}
document.addEventListener('keydown', function(e) {
if (e.key !== 'ArrowLeft' && e.key !== 'ArrowRight') return;
// 입력 중인 요소면 무시
const focused = document.activeElement;
const tag = focused ? focused.tagName : '';
if (['INPUT', 'TEXTAREA', 'SELECT'].includes(tag)) return;
const tabItems = Array.from(tabList.querySelectorAll('li'));
const tabContents = Array.from(container.querySelectorAll(':scope > .mx-tabcontainer-content > div'));
if (tabItems.length === 0) return;
const activeIndex = tabItems.findIndex(li => li.classList.contains('active'));
if (activeIndex === -1) return;
let nextIndex;
if (e.key === 'ArrowLeft') {
nextIndex = activeIndex > 0 ? activeIndex - 1 : tabItems.length - 1;
} else {
nextIndex = activeIndex < tabItems.length - 1 ? activeIndex + 1 : 0;
}
tabItems.forEach(li => li.classList.remove('active'));
tabContents.forEach(div => div.classList.remove('active'));
tabItems[nextIndex].classList.add('active');
if (tabContents[nextIndex]) tabContents[nextIndex].classList.add('active');
e.preventDefault();
});
}
if (document.readyState === 'complete') {
initTabKeyNav();
} else {
window.addEventListener('load', initTabKeyNav);
}
})();

0개의 댓글