Pume

    <script> 

    //헤더 현재 위치 표시 [common.js]
    var pageLocation = String(document.location).split('/');
    fileName = pageLocation[pageLocation.length-1];
    fileDoc = pageLocation[pageLocation.length-2];

    // Activate current nav item
    $('.depth2').find('li > a[href="' + location.protocol +'//' + location.host +'/worklist/pume/' + fileDoc + '/' + fileName + '"]').parent().addClass('on');


    //서브페이지 snb 현재 위치 표시 [sub.js]
    //게시글 뷰페이지 파라미터 값 제외한 파일명만 가져오기(개발 붙은 후 뷰 페이지 파일명 뒤에 파라미터 값이 붙으며 오류 발생하여 수정)
    var sPathName = decodeURIComponent(window.location.pathname), 
        iStrLen = sPathName.length, 
        iLastShash = sPathName.lastIndexOf('/') + 1, 
        sFileName = sPathName.substring(iLastShash, iStrLen);

    // Activate current nav item
    $('.snbbox2').find('li > a[href="' + location.protocol +'//' + location.host +'/worklist/pume/' + fileDoc + '/' + sFileName + '"]').parent().addClass('on');


    //메인페이지 gsap 이용하여 애니메이션 구현
    const items = document.querySelectorAll('.item');

    const expand = (item) => {
        // Toggle active class for the clicked item
        if (item.classList.contains('active')) {
            item.classList.remove('active');
            gsap.to(item, {
                width: '12vw',
                duration: 2,
                ease: 'expo(1, .6)'
            });
        } else {
            // Remove active class from all items
            items.forEach(it => {
                it.classList.remove('active');
                gsap.to(it, {
                    width: '12vw',
                    duration: 2,
                    ease: 'expo(1, .6)'
                });
            });
            // Add active class to the clicked item
            item.classList.add('active');
            gsap.to(item, {
                width: '52vw',
                duration: 2.5,
                ease: 'expo(1, .3)'
            });
        }
    };

    items.forEach((item) => {
        item.addEventListener('click', () => expand(item));
    });

    </script>