각형 애니메이션 및 Phonegap이 모바일에서 실행되지 않습니다.

Question

phonegap 앱에 몇 개의 ng-view 애니메이션 (각도 v 1.1.5)을 추가했습니다. 잔물결을 사용하거나 휴대 전화의 브라우저 (이 경우 앤드롬 크롬)를 온라인으로 앱을 테스트 할 때 브라우저에서 잘 작동하지만 휴대 전화로 설치하면 애니메이션이 실행되지 않습니다. 문제가 전화 갭 또는 각도와 관련이 있는지 확실하지 않습니다. 처음 엔 너무 빠르게 움직이는 것 같아서 1.5 초로 느려졌지만 앱에는 변화가 없었습니다.

이 전화 격차 문제, 각 문제 및/또는 어떻게 이들을 사용할 수 있습니까?

CSS 정의 애니메이션 :

.view-enter, .view-leave { 
    -webkit-transition:all cubic-bezier(0.250, 0.460, 0.450, 0.940) 1.5s; 
    -moz-transition:all cubic-bezier(0.250, 0.460, 0.450, 0.940) 1.5s; 
    -o-transition:all cubic-bezier(0.250, 0.460, 0.450, 0.940) 1.5s; 
    transition:all cubic-bezier(0.250, 0.460, 0.450, 0.940) 1.5s; 
} 

.view-enter { 
    opacity:0; 

} 
.view-enter.view-enter-active { 

    opacity:1; 
} 

.view-leave { 

    opacity:1; 
} 
.view-leave.view-leave-active { 
    left:-100px; 
    opacity:0; 
} 

는 다시이 그것이 폰갭 응용 프로그램 내에서 그냥하지 않을 경우, 휴대 전화의 브라우저에서 잘 작동합니다. Adobe 빌드를 사용하여 앱 만들기. 또한 CSS를 가져 와서 실제 CSS 파일이 phonegap 빌드에 포함되어 있는지 확인하기 위해 페이지에 표시하고 있습니다.

사용자 의견 중 하나에 HTML이 있습니다. 나머지는 각의 기본 애니메이션으로 처리됩니다. 브라우저에서 실행할 때 제대로 작동하지만 휴대 전화 내부에서 실행할 때는 작동하지 않습니다. 라우팅이 작동하고보기가 변경되지만 애니메이션이 절대로 발생하지 않습니다.

<div class="container-fluid" id="viewer" ng-view ng-animate="{enter: 'view-enter', leave: 'view-leave'}" > 


    </div> 

이 확실히 안드로이드 4.2의 주식 브라우저에 문제가 넥서스 4

Answer 1

에서 테스트. 첫 번째 단서는 데스크톱과 Chrome에서 제대로 작동하지만 Phonegap에서는 작동하지 않는다는 것입니다. InAppBrowser는 Android의 주식 브라우저를 사용합니다.

Android 4.2에서 애니메이션 (및 HTML5는 일반적으로)에 대한 지원이 매우 끔찍했습니다. 이러한 단점은 handy rundown입니다.

6 월부터 Android 버전을 업그레이드 할 수 있기를 바랍니다.

Answer 2

오래된 Android에서 배포 할 때 브라우저와 관련된 모든 종류의 속도 저하를 줄이기 위해 (경로로는)을 사용할 수 있습니다.