Saya punya masalah dengan menu ponsel saya. Ini berfungsi dengan baik, tetapi ketika saya menggulir (dengan header lengket) menu akan menjadi abu-abu buram dan tautan tidak tersedia lagi. Saya tidak dapat menemukan masalahnya. Mungkin seseorang bisa membantu saya.

Muncullah "navbar-active" ke dalam kelas saya dan nonaktifkan atau buat lubang menu ponsel itu kabur.

.site-navbar.navbar-scrolled {
  box-shadow: 0 2px 22px 0 rgba(0, 0, 0, 0.06);
  -webkit-backdrop-filter: blur(5px);
  backdrop-filter: blur(5px);
  position: fixed;
  width: 100%;
  z-index: 1030;
  top: 0;
}
0
Marla 25 November 2021, 16:34
Selamat datang di Stack Overflow. Men-debug situs langsung sebenarnya bukan masalah di sini. Pertanyaan itu harus menjadi sesuatu yang juga akan berguna bagi orang lain di masa depan. (Siapa yang tahu apa yang akan terjadi pada situs itu.) Jika Anda bisa membuat demo minimal, Anda akan memiliki kesempatan lebih baik untuk mendapatkan bantuan.
 – 
LSE
25 November 2021, 17:10
Hai, terima kasih. Ya saya mengerti ini. Demo saya tidak bisa memberikan. Tetapi saya menambahkan.. bahwa itu adalah kelas standar (yang akan ditambahkan ketika Anda mulai menggulir) dengan nama navbar-active.
 – 
Marla
25 November 2021, 17:15
Coba ubah z-index menjadi 1050, sehingga akan lebih tinggi dari body-backdrop.
 – 
LSE
25 November 2021, 17:21

1 menjawab

Jawaban Terbaik

body-backdrop memiliki indeks-z 1040.
Jadi mengubah menu ke 1050, memperbaiki masalah.

.site-navbar.navbar-scrolled {
  box-shadow: 0 2px 22px 0 rgba(0, 0, 0, 0.06);
  -webkit-backdrop-filter: blur(5px);
  backdrop-filter: blur(5px);
  position: fixed;
  width: 100%;
  z-index: 1050;
  top: 0;
}
0
LSE 25 November 2021, 17:44