html, css : 버튼 움직임 제어중 transition 중복 문제

[kanayu]

증상

빨간원 안에 버튼을 script로 transition 과 transition-delay로 css속성을 바꿔서 움직임을 제어중 입니다
height값을 0에서 66px 으로 줄엿다 늘렷다 하고 있는데 해당 버튼의 hover 에서도 움직임이 들어가 있습니다. 그렇다보니 delay가 hover에서도 먹혀서 문제입니다
설명을 어떻게 해야될지 모르겟는데..

    $(".btn_more_01").css("height","66px");
    $(".btn_more_01").css("transition-delay",".5s");

오른쪽 첫번째 박스를 선택했을때 버튼에 추가되는 속성이구요

    $(".btn_more_01").css("height","0px");
    $(".btn_more_01").css("transition-delay","0s");

다른 박스가 선택되엇을때 속성 값입니다 이런식으로 조절중인데 hover에서는

.btn_more_01 {
    width:184px;
    height:66px;
    background-color: #e3be25;
    position:absolute;
    bottom:0;
    left:160px;
    letter-spacing: 3px;
    cursor: pointer;
    transition:.5s ease;
    overflow-y: hidden;
}

.btn_more_01:hover {
    margin-bottom:.5%;
    transition: .3s ease;
    -webkit-box-shadow: 
    38px 35px 79px -4px rgba(48,48,48,0.3);
    -moz-box-shadow: 
    38px 35px 79px -4px rgba(48,48,48,0.3);
    box-shadow: 
    38px 35px 79px -4px rgba(48,48,48,0.3);
}

이렇게 위로 올라가며 그림자를 만드는데 delay 가 걸려버려서 마우스를 올려도 0.5초 늦게 움직이네요
딜레이가 걸리는건 당연한거겟지만..
다른 방법이 잇을까요 아니면 제가 방향을 잘못잡은건지 궁금합니다.

아 사이트 주소는 http://kanayu12.cafe24.com/ 입니다.
감사합니다.

[blackdew]

사이트를 보니 너무 멋지네요.

제가 질문을 잘 이해했는지 모르겠네요.
height값 조절 animition 을 위해서 delay를 준 거라면
setTimeout 함수를 사용해서 delay동작이 끝난 뒤에
다시 transition-delay 값을 0으로 만들어 주면 어떨까요?

[kanayu]

아..이런 함수가 있었군요
감사합니다 한번 자료 찾아봐야겟어요!