Dalam iOS16, Z-index pada Safari iPhone tidak boleh berkuat kuasa
P粉346326040
P粉346326040 2023-08-25 20:33:05
0
1
491

Saya mempunyai bar navigasi yang dalam mod mudah alih, cth. pada iPhone dalam Safari, menggunakan kelas ini navbar-mobile

Tetapi entah bagaimana bar navigasi tidak muncul di bahagian atas.

.navbar-mobile { kedudukan: tetap; atas: 0; kanan: 0; kiri: 0; bawah: 0; latar belakang: rgba(0, 0, 0, 0.9); peralihan: 0.3s; -webkit-transform: translate3d(0,0,0); indeks-z: 999 !penting; -webkit-overflow-scrolling: auto !important; jidar atas: 0; }

Ini berlaku dalam semua bahagian. Bahagian-bahagian ini terletak di dalam badan dengan komponen tspartikel digunakan seperti yang ditunjukkan di bawah.

bahagian { peralihan: mudah-masuk-keluar 0.3s; kedudukan: relatif; ketinggian: 100vh; paparan: flex; align-item: tengah; indeks z: 997; limpahan-y: auto; }  badan { font-family: "Open Sans", sans-serif; warna latar belakang: #040404; warna: #fff; kedudukan: relatif; latar belakang: telus; indeks-z: -1; -ms-overflow-style: tiada /* IE dan Edge */ lebar bar skrol: tiada; /* Firefox */ lebar: 100vw; ketinggian: 100vh; } /* ---- tsbekas zarah ---- */ #tspartikel { lebar: 100%; ketinggian: 100%; indeks-z: -1; }

Saya telah mencuba menggunakan -webkit-transform: translate3d(0,0,0); tetapi malangnya saya tidak dapat menyelesaikan masalah. Ini berfungsi dalam penyemak imbas lain, satu-satunya masalah ialah dengan Safari pada iPhone.

P粉346326040
P粉346326040

membalas semua (1)
P粉428986744

Kami mengalami isu yang sama pada semua penyemak imbas untuk IOS 16. Cuba tetapkan nilai indeks-z antara 0-9. Ini menyelesaikan masalah untuk kami.

.navbar-mobile { position: fixed; top: 0; . . z-index: 9; } section { transition: ease-in-out 0.3s; position: relative; . . z-index: 5; } body { font-family: "Open Sans", sans-serif; background-color: #040404; color: #fff; . . z-index: -1; //(或者尝试1) }
    Muat turun terkini
    Lagi>
    kesan web
    Kod sumber laman web
    Bahan laman web
    Templat hujung hadapan
    Tentang kita Penafian Sitemap
    Laman web PHP Cina:Latihan PHP dalam talian kebajikan awam,Bantu pelajar PHP berkembang dengan cepat!