Pertanyaan Menyembunyikan elemen di pageLoad () dengan jQuery


Jika saya menyembunyikan beberapa elemen di page_load menggunakan jquery, elemen-elemen berkedip selama sepersekian detik ketika posting halaman dan kemudian menghilang:

  function pageLoad() {

        $('#panelOne').hide();
        $('#panelTwo').hide();

Apakah ada cara untuk mencegah kerlip?

Saya tidak ingin mengatur elemen css ke visibilitas: tersembunyi, karena kemudian memanggil jquery .show () metode nanti tampaknya tidak menunjukkan elemen.


6
2018-05-12 22:25


asal


Jawaban:


Pengaturan visibility: hidden tidak berfungsi, tapi display: none tidak. Lihat jsFiddle.

Anda dapat melakukan ini pada acara DOMReady, tetapi akan lebih bersih untuk melakukannya dalam CSS.


6
2018-05-12 22:31



$.show() tidak berfungsi pada elemen yang disetel visibility: hidden. Anda perlu menggunakan display: none. Ini akan bekerja lebih baik untuk Anda daripada menggunakan jQuery untuk bersembunyi di DOM siap, dan benar-benar akan menjamin Anda tidak akan melihat berkedip.


2
2018-05-12 22:31



Daripada menyembunyikan di pageload, sembunyikan di domready seperti:

$(function() { ........ });

Ganti ...... dengan 2 baris persembunyian Anda.

Domready berjalan ketika dom-tree telah dibangun, dan jauh lebih awal dari pageLoad. Pageload menunggu gambar dan hal-hal untuk dijalankan. (asumsikan bahwa Anda memiliki pageLoad sebagai berikut: <html onload="pageLoad();">).


1
2018-05-12 22:28



Pastikan menggunakan dokumen yang siap dibandingkan dengan pemuatan halaman:

$(function() {
    $('#panelOne, #panelTwo')
        .hide();
});

1
2018-05-12 22:30