Hình động và Điện thoại không hoạt động trên điện thoại di động

Question

Tôi đã thêm một vài hoạt ảnh ng-view (angular v 1.1.5) vào ứng dụng phonegap. Chúng hoạt động tốt trong trình duyệt khi kiểm tra cả bằng cách sử dụng gợn và khi trỏ trình duyệt của điện thoại di động (android chrome trong trường hợp này) vào ứng dụng trực tuyến, nhưng khi được cài đặt bằng điện thoại, hoạt ảnh không chạy. Tôi không chắc chắn nếu vấn đề là với phonegap hoặc với góc cạnh. Lúc đầu, tôi nghĩ rằng nó chỉ hoạt hình quá nhanh nên tôi làm chậm chúng xuống 1.5 nhưng nó không thay đổi trong ứng dụng.

Đây có phải là vấn đề về khoảng cách điện thoại, vấn đề góc cạnh và/hoặc cách chúng tôi có thể sử dụng chúng?

CSS định nghĩa hoạt hình:

.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; 
} 

Một lần nữa những công việc tuyệt vời trong trình duyệt của điện thoại, chỉ cần không phải khi nó là bên trong ứng dụng PhoneGap. Sử dụng Adobe build để xây dựng ứng dụng. Tôi cũng đang lấy css và hiển thị trên trang chỉ để xác nhận tệp css thực tế được bao gồm trong bản xây dựng điện thoại (có nghĩa là).

Mỗi một trong các nhận xét của người dùng, đây là HTML. Phần còn lại được xử lý bởi các hoạt ảnh mặc định của angular. Chúng hoạt động tốt khi chạy trong trình duyệt nhưng không hoạt động khi chạy bên trong điện thoại. Các công trình định tuyến, ng-view được thay đổi, nhưng hoạt ảnh không bao giờ xảy ra.

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


    </div> 

Thử nghiệm trên Nexus 4.

Answer 1

này chắc chắn là một vấn đề với trình duyệt cổ Android 4.2 của. Các đầu mối đầu tiên là nó hoạt động tốt trên máy tính để bàn và trong Chrome, nhưng không phải trong Phonegap - InAppBrowser sử dụng trình duyệt chứng khoán của Android.

Hỗ trợ hoạt ảnh (và HTML5 nói chung) khá khủng khiếp trong Android 4.2. Đây là một số handy rundown trong số đó.

Hy vọng rằng bạn đã có thể nâng cấp phiên bản Android của mình kể từ tháng 6!

Answer 2

Bạn có thể xem xét CocoonJS (hoạt động với Cordova) hoặc Crosswalk làm đường dẫn để tăng tốc độ chậm của trình duyệt khi triển khai trên Android cũ hơn.