Closed
Description
증상
빨간원 안에 버튼을 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/ 입니다.
감사합니다.