Masalah peralihan kabur penapis tanah

Question

Menekan butang mengaburkan latar belakang, tetapi apabila beralih, tepi div tidak beralih dengan baik. Masalah ini wujud dalam semua pelayar kecuali Firefox, bagaimana saya boleh membetulkannya? varbtn=document.querySelector('button');vardiv=document.querySelector('div');btn.addEventListener('click',function(){div.classList.toggle('

P粉147747637 · Answer

Sebab imej diisi ，但是.blur在

dan hanya 900x900 piksel.

Pembetulan Pantas:

Ubah: var div = document.querySelector('div');

Kepada: var div = document.body;

Atau: Bergerak background: url(..); background-size: .. 到 div dan dapatkannya dari sana.

var btn = document.querySelector('button');
var div = document.body;
            
btn.addEventListener('click', function() {              
    div.classList.toggle('blur');           
});

body {
    margin: 0;
    background: url('https://images.pexels.com/photos/2763927/pexels-photo-2763927.jpeg?auto=compress&cs=tinysrgb&w=1260&h=750&dpr=1')no-repeat;
    background-size: cover;
}

div {
    width: 900px;
    height: 900px;
    transition: 1s ease;    
}

.blur {
    backdrop-filter: blur(20px);
    transition: 1s ease;        
}

Php8, saya datang juga

Ketahui reka letak tapak web dalam masa 30 minit

Tutorial Video Permulaan Shangguan Oracle kepada Mahir

Baris pertama kod UNI-APP anda

Berkibar dari awal ke pelancaran apl

Tutorial Video Linux Baharu Brother Lian

Tutorial Video AXURE 9 (Sesuai untuk UI Reka Bentuk Produk Interaktif Pengurus Produk)

Tutorial Video PS Kemahiran Asas Sifar

Tutorial video UI 16 hari untuk anda bermula

Tutorial Video Teknik PS dan Teknik Menghiris

Tutorial Video Pembinaan Persekitaran Awan Alibaba dan Pelancaran Projek

Gambaran Keseluruhan Rangkaian Komputer - Pengetahuan Asas yang Perlu Dikuasai Pengaturcara

Tutorial Penting untuk Pengaturcara - Penjelasan Protokol HTTP

Tutorial Video Websocket