Berikut ialah beberapa tajuk artikel berasaskan soalan yang merangkumi kandungan: Langsung dan Bermaklumat: * Mengapa window.innerHeight Berbeza daripada window.outerHeight dalam Mod Landskap iPad iOS 7? * Bagaimana t

Percanggahan Reka Letak Landskap Safari iPad iOS 7

Apabila menggunakan iPad iOS 7 dalam mod landskap, isu yang membingungkan timbul dengan apl web di mana tetingkap .innerHeight dan window.outerHeight tidak sejajar. Perbezaan 20px ini mengakibatkan elemen navigasi dikaburkan dan kedudukan mutlak tidak diselaraskan di bahagian bawah skrin.

Untuk menangani isu ini dan mengelakkannya daripada mengganggu pengalaman pengguna, penyelesaian boleh dilaksanakan. Dengan meletakkan elemen badan secara mutlak secara khusus dalam iOS 7:

body {
    position: absolute;
    bottom: 0;
    height: 672px !important;
}

Malangnya, pendekatan ini hanya mengalihkan ruang tambahan ke bahagian atas halaman dan bukannya menyelesaikannya. Penyelesaian alternatif yang terbukti berkesan ialah mengubah suai kedudukan kepada tetap:

@media (orientation:landscape) {
    html.ipad.ios7 > body {
        position: fixed;
        bottom: 0;
        width:100%;
        height: 672px !important;
    }
}

Selain itu, skrip boleh digunakan untuk mengesan peranti iPad yang menjalankan iOS 7:

if (navigator.userAgent.match(/iPad;.*CPU.*OS 7_\d/i)) {
    $('html').addClass('ipad ios7');
}

Atas ialah kandungan terperinci Berikut ialah beberapa tajuk artikel berasaskan soalan yang merangkumi kandungan: Langsung dan Bermaklumat: * Mengapa window.innerHeight Berbeza daripada window.outerHeight dalam Mod Landskap iPad iOS 7? * Bagaimana t. Untuk maklumat lanjut, sila ikut artikel berkaitan lain di laman web China PHP!