trang Web không nhận được chiều cao 100% trong ứng dụng Twitter trên iOS 8

Question

Hệ điều hành: iOS 8.1.1 Trình duyệt: Safari Điện thoại: iPhone 5C

Chúng tôi có một trang web mà mất 100% chiều cao và chiều rộng. Chúng tôi đã khóa chế độ xem để người dùng không thể cuộn trang theo chiều dọc hoặc chiều ngang. Trang này được chia sẻ trên Twitter thông qua trình duyệt web Safari. Khi chúng tôi xem trang web trong ứng dụng twitter, phần dưới cùng của trang sẽ bị cắt. Chúng tôi không thể xem toàn bộ trang. Ngay cả khi chúng ta thay đổi định hướng nhiều lần thì phần cắt được không nhìn thấy được.

Chiều cao của phần bị cắt ngang bằng với chiều cao của tiêu đề của thùng chứa ứng dụng twitter (phần có nút chéo, tiêu đề trang/url và liên kết chia sẻ) và thanh trạng thái (phần có biểu tượng trạng thái mạng, thời gian, mức pin, v.v.)

Lưu ý: Hành vi này được quan sát trong iOS 8 chỉ.

Answer 1

Đối với bất cứ ai khác đi ngang qua đây, việc sửa chữa tôi đã kết thúc sử dụng là

window.addEventListener("resize", function(){ 
     onResize(); 
    }); 

    function onResize(){ 
     document.querySelector("html").style.height = window.innerHeight + "px" 
    }; 

    onResize(); 

này dường như làm việc trong phiên bản mới nhất của trình duyệt twitter của trên safari.

Answer 2

Điều này cũng khiến tôi phát điên trong vài giờ qua. Giải pháp là không sử dụng px hoặc tỷ lệ phần trăm dựa chiều cao/chiều rộng nhưng thay vì sử dụng position:fixed trên html và body của bạn yếu tố, sau đó thiết lập hàng đầu, trái, phải, phía dưới là 0. Vì vậy, mã di chúc của bạn trông như thế này:

html, body{ 
    position:fixed; 
    top:0; 
    left:0; 
    right:0; 
    bottom:0; 
} 

Điều này buộc nội dung chỉ rộng và cao như khung nhìn được trình bày trong thành phần webview twitters mà không bị tràn. Bất kỳ mã nào bên trong cơ thể giờ đây có thể là 100% theo một trong hai hướng mà không sợ bị ẩn. Lỗi này cũng ảnh hưởng đến iOS9. Xác nhận bản sửa lỗi đang hoạt động trên iOS9.1 với ứng dụng Twitter mới nhất trên ip6/6 +, ip5 và ip4.