CSS3 회전 사용시 페이드 아웃 할 수 없음

Google 크롬에 다소 이상한 문제가 있습니다. CSS3 변환 (회전)을 적용했을 때 H1 요소를 페이드 아웃 할 수 없습니다. 이것은 이상한 문제처럼 보입니다. 이미지를 사용하는 것 이외의 방법으로는 얻을 수 없습니다. 아무도이 문제를 해결할 수있는 방법을 알지는 못하지만 이미지로 해킹하고 싶지 않습니다. 여기 CSS3 회전 사용시 페이드 아웃 할 수 없음

은이 특정 H1

.studieprogramLinje h1{ 
color:#fff; 
-webkit-transform: rotate(90deg); 
-moz-transform: rotate(90deg); 
-ms-transform: rotate(90deg); 
-o-transform: rotate(90deg); 
transform: rotate(90deg); 
white-space: nowrap; 
margin-top:270px; 
font-weight: 100; 
}

그리고 JQuery와 부분에 대한 CSS입니다 :

그것은 내가 이런 모든 H1 요소 페이드 아웃 경우에 작동하는 것 같군

$('#mobilApputvikling h1').fadeOut(200);

를

$('h1').fadeOut(200);

하지만이 특정 항목은 아닙니다. 그러나 CSS3에서 회전을 제거하면 작동합니다.

출처

2013-01-13 Steffen Martinsen

당신은 테스트 링크 또는를 제공해야 더 나은 내가 그 시도했지만하지 않는 것 회전 한 jsfiddle –

JSFiddle에서 작업하십시오. –

Rotate (CSS3)가 jsfiddle에서 작동해야합니다. –

대신 jQuery 애니메이션을 사용해 보았습니까? 아마도 같은 효과가있을 것이지만 해결 방법이 될 수 있습니다.

$('h1').animate({ opacity: 0 }, 200);

주위에 작업이없는 경우, 어떻게 버그 제출에 대한 : Chromium Bugs이

출처

2013-01-13 14:18:53 Will

그래, 그걸 시도해 봤어. 언급하는 것을 잊어 버렸습니다 - 어느 쪽이든 여전히 작동하지 않습니다. 아무것도 일어나지 않고있다. –

끌기. (구글에 버그를 제출하는 것은 어떨까요? – Will

나는 그것에 대해 생각 했었습니다. 아마도 이상한 문제였습니다! 사파리와 똑같은 것 같아서 웹킷 문제 일 수도 있습니다. 지금 이미지로 해킹 해주세요! 답장을 보내 주셔서 감사합니다! –

CSS3 회전 사용시 페이드 아웃 할 수 없음

답변

관련 문제