2011-07-01 5 views
1

CSS3로 스타일링하는 비교적 복잡한 버튼이 있습니다. 전환이 작동하지 않는다는 점을 제외하고 의도 한 것처럼 보이고 동작합니다. 마우스 오버 등으로 사라져야하지만 작동하지 않고 moz opera와 chrome, no luck에서 테스트되었습니다.CSS3 트랜지션이 작동하지 않습니다.

가 여기에 바이올린 어떤 도움을 주시면 감사하겠습니다 http://jsfiddle.net/dsyne/DpsuN/1/

에 대한 링크입니다, 나는 많은 다른 것들을 시도했습니다. 예를 들어 스택 재정렬. 전환이 중요 할 때 주문이 중요한지 확실하지 않습니다.

편집 : 잘못된 링크 죄송합니다.

답변

1

그래디언트는 아직 전환을 직접 지원하지 않습니다. 배경색을 정의한 다음 상태에 따라 동일한 음영을 추가하는 순수한 알파 그라디언트를 사용해야합니다.

+0

다음과 같이 순수한 알파를 의미합니까? 'background : -moz-linear-gradient (top, rgba (0,102,153,0.8), rgba (0,102,153,1));' 전환은 정상 상태에서 그라디언트로 작동하지만 hover/focus/active 상태에 그라디언트를 추가하지 않은 경우에는 작동하지 않는 것 같습니다. – tcnarss

+0

알파를 변경하는 흰색 그라데이션을 사용하여 마침내 작동합니다. 모든 상태에서 정확히 동일한 그래디언트 값으로 작업하는 것 같습니다. 또한주의해야 할 점은 배경색이 CSS의 그라디언트 아래에 선언되어 있지 않으면 작동하지 않는다는 것입니다. 저를 올바른 방향으로 향하게 해주셔서 대단히 감사합니다. – tcnarss

+1

예, 가장자리에있는 웹 개발자의 기쁨! :-) –

관련 문제